Front-End/HTML
[HTML] fieldset 태그, legend 태그
찐코딩
2021. 10. 27. 21:32
fieldset 태그
HTML 태그들을 하나의 박스로 묶어주는 태그legend 태그
fieldset 태그에 제목을 부여하는 태그
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
<fieldset>
<legend>필수 입력 사항</legend>
<ul>
<li> 이 름 : <input type="text"> </li>
<li> 아이디 : <input type="text" size="20"
placeholder="6자 이상 20자 미만 공백 없이"> </li>
<li> 이메일 : <input type="text"> </li>
<li> 연락처 : <input type="text"> </li>
<li>
<input type="submit" value="가입하기">
<input type="reset" value="다시작성">
</li>
</ul>
</fieldset>
<fieldset>
<legend>선택 입력 사항</legend>
<ul>
<li>
<input type="checkbox" name="hobby" value="운동">운동
<input type="checkbox" name="hobby" value="여행">여행
<input type="checkbox" name="hobby" value="독서">독서
<input type="checkbox" name="hobby" value="잠자기">잠자기
<input type="checkbox" name="hobby" value="숨쉬기">숨쉬기
</li>
<li>
<input type="radio" name="gender" value="남자">남
<input type="radio" name="gender" value="여자">여
</li>
</ul>
</fieldset>
</body>
</html>