2-3시간 시간 내서 만든 가벼운 홈페이지 이다.
프론트 가져다 써와서 수정한 홈페이지 이며 수정 할게 있다면 백엔드 좀만 추가 해서 로그인 기능도 넣으면 좀더 괜찮을거 같다
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>나의 첫 홈페이지 (타이틀)전세훈 </title>
<style>
body {
font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
margin: 0;
padding: 0;
background-color: #f8f8f8;
}
header {
background-color: #333;
color: #fff;
padding: 20px;
text-align: center;
font-size: 24px;
margin-bottom: 20px;
}
section {
padding: 20px;
background-color: #fff;
box-shadow: 0 0 20px rgba(0, 0, 0, 0.1);
border-radius: 12px;
}
img {
max-width: 100%;
height: auto;
border-radius: 12px;
margin-bottom: 20px;
}
p {
line-height: 1.6;
margin-bottom: 15px;
}
hr {
border: 0.5px solid #ddd;
margin: 20px 0;
}
</style>
<script src="comon.js"></script>
<style>
div {
padding: 10px;
}
</style>
</head>
<body>
<header>
<h1>나의 첫 홈페이지 전세훈</h1>
</header>
<div>
<label> 아이디 : <input id="id" type="text"></label>
</div>
<div>
<label> 비밀번호 : <input id="pw" type="text"></label>
</div>
<div>
<a href="join.html><input type="button" value="회원가입"></a>
<input type="button" value="로그인" onclick="create_id();">
</div>
<section>
<img src="sk.jpg" alt="오늘 날씨">
<p><u>2023년 11월 16일 - 화요일</u></p>
<p>오늘은 날씨가 맑고 상쾌하다. 아침에 일어나서 창문을 열어보니 맑은 하늘이 반겨주었다. 그리고 시원한 바람이 부는 것 같아 얼굴에 산뜻한 감촉이 느껴졌다. 이런 날씨에서 시작하는 하루는 기분 좋게 펼쳐질 것 같다.</p>
<p>출근길에는 햇살이 거리를 따뜻하게 비추고 있었다. 도시의 풍경도 맑고 선명하게 보여서 마음이 가볍워졌다. 지난 주보다는 분명히 더 활기찬 느낌이었다.</p>
<p>오늘의 교훈: 바쁜 일상에서도 가끔은 주변을 둘러보고 소중한 사람들과 함께하는 시간을 갖자. 작은 행복이 큰 힘이 된다.</p>
<hr>
<img src="bd.jpg" alt="바다">
<p><u>2023년 11월 17일 - 목요일</u></p>
<p>오늘은 바다에서 소소한 휴식을 취하며 한가로운 시간을 보냈다. 부드럽게 밀려오는 파도 소리가 고요한 마음을 전하고, 그윽한 소금냄새가 신선한 공기를 가득 채웠다.</p>
<p>바닷가는 차분하게 파도를 내비친다. 파도는 느긋하게 밀려오면서 모래 속에 작은 발자국을 남긴다. 그 발자국은 잠시 머무르고는 바람에 스쳐 사라진다. 그리고 나는 그 모래 위에 앉아, 시간을 잊고 파도의 리듬에 귀를 기울이곤 했다.</p>
<p>바다의 푸른 무한함이 마치 나의 마음을 여유롭게 만들어주는 것 같다. 휴식을 취하면서 어김없이 나타나는 멀리 떠나간 배들을 바라보면, 일상의 소소한 고민들이 사라지고 마음은 정화된다.</p>
<p>햇볕은 부드럽게 피부를 감싸며, 살랑거리는 바람은 마음을 가볍게 만든다. 어느새 해는 저물고, 바다는 일몰의 아름다움으로 물들어간다. 그 길게 뻗어있는 노을이 바다 위로 퍼져나가면서, 마치 세계의 끝에 서 있는 듯한 느낌이 들었다.</p>
<p>이런 순간들은 나에게 평온함을 선사한다. 울긋불긋한 노을과 함께 바다는 저녁의 휴식을 맞이한다. 어제와 같은 날이지만, 각각의 순간은 특별하게 느껴진다. 그저 여유 있게 흘러가는 일상의 한 조각, 바다와 함께한 소소한 일상이었다.</p>
</section>
</body>
</html>
________________________________________________________________________________________________
function login(){
var id = document.querySelector('#id');
var pw = document.querySelector('#pw');
if(id.value == "" || pw.value == ""){
alert("로그인을 할 수 없습니다.")
}
else {
location.href = 'ad.html';
}
}
function back() {
history.go(-1);
}
function create_id() {
var id = document.querySelector('#id');
var pw = document.querySelector('#pw');
var r_pw = document.querySelector('#r_pw');
if(id.value == "" || pw.value == "" || r_pw.value == "") {
alert("회원가입을 할 수 없습니다")
}
else {
if(pw.value !== r_pw.value) {
alert("비밀번호를 확인해주세요.")
}
else {
location.href = 'login.html';
}
}
}