개념
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<h1>
회원가입
</h1>
<!-- label for 를 사용하면 글자를 클릭해도 input 태그의 커서가 선택된다. -->
<form action="#" >
<label for="user_name">이름</label>
<input type="text" id="user_name" required placeholder="이름"/>
<br/>
<label for="user_id">아이디</label>
<input type="text" id="user_id" required placeholder="아이디" minlength="6" maxlength="15"/>
<br/>
<label for="user_password">비밀번호</label>
<input type="password" id = "user_password" required placeholder="비밀번호" minlength="6" maxlength="15"/>
<br/>
<label for="user_email">이메일</label>
<input type="email" id = "user_email" required placeholder="이메일"/>
<br/>
<label for="user_number">전화번호</label>
<input type="tel" id = "user_number" required placeholder="전화번호 (***-****-****)" pattern="[0-1]{3}-[0-9]{4}-[0-9]{4}" />
<br/>
<label for="user_profile">프로필 사진</label>
<input type="file" id = "user_profile" accept="image/*, video/*" required placeholder="프로필사진" />
</form>
</body>
</html>
HTML
복사