HTML <option> 태그

정의 및 사용법

<option> 선택 목록에서의 옵션을 정의합니다。

<option> 태그는 <select>、<optgroup> 또는 <datalist> 요소 내에 있습니다。

주의하세요：<option> 할당된 속성이 없는 경우에도 태그를 사용할 수 있지만, 대체로 value 속성이 필요합니다. 이 속성은 양식이 서버로 전송될 때 전송되는 내용을 지시합니다。

ヒント：很长의 옵션 목록이 있으면 <optgroup> 표지에서 관련 옵션을 그룹화합니다。

또한 참조하십시오：

HTML DOM 참조 가이드：Option 객체

예제

예제 1

네 가지 옵션을 포함한 드롭다운 목록：

<label for="cars">차량 브랜드를 선택하세요：</label>
<select id="cars">
  <option value="audi">奥迪</option>
  <option value="byd">비디아</option>
  <option value="geely">지리기">
  <option value="volvo">보르고</option>
</select>

직접 시험해 보세요

예제 2

에서 <datalist> 요소에서 사용 <option>：

<label for="browser">리스트에서 귀하의 브라우저를 선택하세요：</label>
<input list="browsers" name="browser" id="browser">
<datalist id="browsers">
  <option value="Edge">
  <option value="Firefox">
  <option value="Chrome">
  <option value="Opera">
  <option value="Safari">
</datalist>

직접 시험해 보세요

예제 3

에서 <optgroup> 요소에서 사용 <option>：

<label for="cars">차량 브랜드를 선택하세요：</label>
<select id="cars">
  <optgroup label="중국차">
    <option value="byd">비디아</option>
    <option value="geely">지리기">
  </optgroup>
  <optgroup label="독일차">
    <option value="mercedes">메르세데스</option>
    <option value="audi">奥迪</option>
  </optgroup>
</select>

직접 시험해 보세요

속성

속성 값 설명
disabled disabled 옵션을 비활성화하도록 정의합니다.
label 텍스트 옵션에 짧은 태그를 정의합니다.
selected selected 페이지 로드할 때 예약 선택된 옵션을 정의합니다.
value 텍스트 서버로 전송되는 값을 정의합니다.

전역 속성

<option> 태그는 또한 HTML에서의 전역 속성.

이벤트 속성

<option> 태그는 또한 HTML에서 이벤트 속성.

기본 CSS 설정

없음.

브라우저 지원

크롬 에지 파이어폭스 사파리 오페라
크롬 에지 파이어폭스 사파리 오페라
지원 지원 지원 지원 지원