HTML - select 태그

yeong ·2022년 11월 10일

select 태그 : 목록에서 값을 선택하여 입력받기 위한 태그 - 입력태그
기본적으로 단일값을 선택하여 전달 가능하지만 속성에 의해 다수값 선택 가능
하위태그 : option, optgroup
multiple 속성 : 다수의 목록을 선택하기 위한 속성 - 속성값 생략 가능

예시
<form action="#" method="post">
		<label for="class">학과</label>
		<!-- <select id="class" name="class" multiple="multiple"> -->
		<select id="class" name="class">
			<!-- optgroup 태그 : option 태그을 하나의 그룹으로 표현하기 위한 태그 -->
			<!-- label 속성 : 그룹의 이름을 속성명으로 설정 -->
			<optgroup label="공과대">
				<!-- option 태그 : 선택 목록에 대한 값을 제공하기 위한 태그 -->
				<!-- selected 속성 : 우선 선택 속성 - 속성값 생략 가능 -->
				<option value="arch">건축공학과</option>
				<option value="machinic">기계공학과</option>
				<option value="indust">산언공학과</option>
				<option value="computer" selected="selected">컴퓨터공학과</option>
				<option value="chemical">화학공학과</option>
			</optgroup>
			<optgroup label="인문대">
				<option value="history">사학과</option>
				<option value="lang">어문학과</option>
				<option value="philo">철학과</option>
			</optgroup>
		</select>	
		
		<button type="submit">입력완료</button>	
	</form>

0개의 댓글