>  기사  >  웹 프론트엔드  >  HTML의 드롭다운 목록 선택을 위한 그래픽 코드에 대한 자세한 설명

HTML의 드롭다운 목록 선택을 위한 그래픽 코드에 대한 자세한 설명

黄舟
黄舟원래의
2017-07-26 09:53:573374검색

HTML의 드롭다운 목록:

Html 코드 HTML의 드롭다운 목록 선택을 위한 그래픽 코드에 대한 자세한 설명

<select>  
  <option value ="1">Volvo</option>  
  <option value ="2">Saab</option>  
  <option value="3">Opel</option>  
  <option value="4">Audi</option>  
</select>

여기서 선택은 드롭다운 목록(드롭다운 목록)을 표시하는 것이고, 옵션은 드롭다운 목록의 항목입니다. 옵션 텍스트 내용은 페이지의 드롭다운 목록 항목에 표시되는 값이고, 값은 실제로 서버에 제출해야 하는 값입니다.
표시 효과는 다음과 같습니다.


더 복잡한 드롭다운 목록:

Html 코드 HTML의 드롭다운 목록 선택을 위한 그래픽 코드에 대한 자세한 설명

<select>  
  <optgroup label="Swedish Cars">  
    <option value="1">Volvo</option>  
    <option value="2">Saab</option>  
  </optgroup>  
  <optgroup label="German Cars">  
    <option value="3">Mercedes</option>  
    <option value="4">Audi</option>  
  </optgroup>  
</select>

이 드롭다운 목록에는 "ite"가 포함되어 있습니다. m 그룹" (항목 그룹) 이 그룹은 선택할 수 없습니다. 실제로 작동하는 것은 값 속성입니다.
"프로젝트 그룹"이 포함된 이 드롭다운 목록을 보세요.


옵션 매개변수: selected="selected"
페이지를 열어야 하는 경우 기본적으로 옵션이 선택됩니다. 선택한 매개변수를 사용해야 합니다:

Html 코드 HTML의 드롭다운 목록 선택을 위한 그래픽 코드에 대한 자세한 설명

<select>  
  <option value="1">Volvo</option>  
  <option value="2">Saab</option>  
  <option value="3" selected="selected">Mercedes</option>  
  <option value="4">Audi</option>  
</select>

옵션의 매개변수: 비활성화="비활성화"
항목을 비활성화해야 하지만 숨기고 싶지 않은 경우 다음을 사용할 수 있습니다. 비활성화된 속성

Html 코드 HTML의 드롭다운 목록 선택을 위한 그래픽 코드에 대한 자세한 설명

<select>  
  <option value="1">Volvo</option>  
  <option value="2">Saab</option>  
  <option value="3" disabled="disabled">Mercedes</option>  
  <option value="4">Audi</option>  
</select>

옵션 매개변수: 제목
항목에 마우스를 놓았을 때 프롬프트를 표시해야 하는 경우 제목 속성

Html 코드를 사용할 수 있습니다. HTML의 드롭다운 목록 선택을 위한 그래픽 코드에 대한 자세한 설명

<select>  
  <option value="1">Volvo</option>  
  <option value="2">Saab</option>  
  <option value="3">Mercedes</option>  
  <option value="4" title="Audi, your best choice!">Audi</option>  
</select>

사실 제목은 다른 많은 HTML 태그에도 사용될 수 있습니다!

위 내용은 HTML의 드롭다운 목록 선택을 위한 그래픽 코드에 대한 자세한 설명의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.