<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Test023.html</title>
</head>
<body>
<div>
<h1>드롭다운메뉴(selectbox) 만들기</h1>
<hr>
</div>
<div>
<form>
<!--
<p>당신이 가장 좋아하는 운동은?</p>
<select name = "selectSport">
<option>--- 선택하세요 ---</option>
<option value="val1">야구</option>
<option value="val2">축구</option>
<option value="val3">배구</option>
<option value="val4">농구</option>
</select>
-->
<!-- 사용자가 편한 것은 다수가 덜 움직여야하는 것 -->
<!-- 웹에서 사원이 가장 많으므로 사원을 기본값으로 지정 selected -->
<p>당신의 직책은?</p>
<select name = "selectJikwi">
<option value = "1">회장</option>
<option value = "2">사장</option>
<option value = "3">이사</option>
<option value = "4">부장</option>
<option value = "5">과장</option>
<option value = "6">대리</option>
<option value = "7" selected="selected">사원</option>
<option value = "8">인턴</option>
</select>
<br><br>
<button type = "button">확인</button>
<button type = "reset">취소</button>
<p>가고싶은 여행지는?(다중선택가능)</p>
<select name = "trav" multiple="multiple" size = "6">
<option value = "val1">백두산</optiion>
<option value = "val1">한라산</optiion>
<option value = "val1">지리산</optiion>
<option value = "val1">설악산</optiion>
<option value = "val1">속리산</optiion>
<option value = "val1">북한산</optiion>
</select>
</form>
</div>
</body>
</html>select 태그로 option 을 부여, 특정 주제에 대한 여러 값들을 선택할 수 있게 만들어준다.
option의 실제 값은 백두산 이 아닌 val1 이라는 것..
value=? ----> 이걸 중요하게 생각해보자.
728x90
'WEB Archive' 카테고리의 다른 글
| [HTML] textarea (텍스트 에어리어) 태그 살펴보기 (0) | 2024.08.19 |
|---|---|
| [HTML] 선택상자(checkbox) 만들기 (0) | 2024.08.19 |
| [HTML] 라디오 버튼 만들기 (0) | 2024.08.19 |
| [HTML] 전송, 취소버튼 만들기(submit, reset) (0) | 2024.08.19 |
| [HTML] CSS - 가상 요소 적용 실습(계속) (0) | 2022.05.18 |
댓글