728x90
300x250
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>폼</title>
</head>
<body>
<form>
<!-- 텍스트 -->
<div>
<label for="name">이름</label>
<input placeholder="이름을 입력" autofocus type="text" id="name">
</div>
<!-- Email -->
<div>
<label for="email">이메일</label>
<input required type="email" id="email"> <!-- required 필수로 입력 -->
</div>
<!-- 패스워드 -->
<div>
<label for="password">비밀번호</label>
<input type="password" id="password">
</div>
<!-- 텍스트에어리어 -->
<div>
<label for="massage">메세지</label>
<textarea id="massage" cols="30" rows="3"></textarea>
</div>
<!-- select -->
<div>
<label for="gender">성별</label>
<select id="gender">
<option value="male">남성</option>
<option value="female" selected>여성</option>
<option value="other">Other</option>
</select>
</div>
<!-- 숫자:number -->
<div>
<label for="age">나이</label>
<input type="number" id="age">
</div>
<!-- 날짜:date -->
<div>
<label for="bithdate">생년월일</label>
<input type="date" id="birthdate">
</div>
<!-- 라디오 버튼:이름이 같음 -->
<div>
<label>멤버쉽</label>
<input type="radio" name="member" value="simple" checked>심플
<input type="radio" name="member" value="standard">스탠다드
<input type="radio" name="member" value="super">슈퍼
</div>
<!-- 체크 버튼:다중선택 -->
<div>
<label>I Like</label>
<input type="checkbox" value="bike">오토바이
<input type="checkbox" value="car">자동차
<input type="checkbox" value="boat">보트
</div>
<!-- 서버로 입력내용을 보내는 버튼 -->
<input type="submit" value="서버로 제출">
<!-- 리셋버튼 -->
<button type="reset">리셋</button>
<input type="submit" value="확인">
</form>
</body>
</html>이메일은 이메일 타입형식으로 들어가야 한다. @ 들어가야함
728x90
반응형
'Front-end > HTML' 카테고리의 다른 글
| 테이블 코딩 쉽게하기 (0) | 2021.06.26 |
|---|---|
| Height 100% 적용 안될 때 (0) | 2021.06.16 |
| 웹 용어 정리 (0) | 2021.05.26 |
| html 구글지도 iframe 넣기 :: (0) | 2021.05.25 |
| [css] 화면 중앙에 배치시키기 :: 세로 중앙정렬 (0) | 2021.04.27 |
댓글