1) HTML 기본 틀 작성
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8">
<title>로그인</title>
</head>
<body>
</body>
</html>
2) <body> 내부에 로그인 폼 작성
<body>
<form id="login">
<ul>
<li>
<label for="id">아이디</label>
<input type="text" id="id">
</li>
<li>
<label for="pw">비밀번호</label>
<input type="password" id="pw">
</li>
<input type="submit" value="로그인">
<button onclick="location.href='sign.html'">회원가입</button>
</ul>
</form>
</body>
3) 결과
4) 전체 코드
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8">
<title>로그인</title>
<style>
ul {list-style:none;}
</style>
</head>
<body>
<form id="login">
<ul>
<li>
<label for="id">아이디</label>
<input type="text" id="id">
</li>
<li>
<label for="pw">비밀번호</label>
<input type="password" id="pw">
</li>
<input type="submit" value="로그인">
<button onclick="location.href='sign.html'">회원가입</button>
</ul>
</form>
</body>
</html>'Front-end > HTML' 카테고리의 다른 글
| [HTML] 기본 틀 (0) | 2022.11.15 |
|---|