HTML5에서 드롭 다운 목록 필드를 만드는 방법 - 더미

웹 사이트의 양식에있는 드롭 다운 목록은 소량의 화면 공간에서 많은 옵션을 사용자에게 제공 할 수있는 좋은 방법입니다. 두 개의 HTML 태그를 사용하여 드롭 다운 목록을 만듭니다.

• 는 목록을 만듭니다.

  목록에 이름을 붙이려면 요소와 함께 name 속성을 사용하십시오.

• 요소 집합은 개별 목록 옵션을 식별합니다.

  value 속성은 각 요소에 고유 한 값을 할당합니다.

드롭 다운 목록의 마크 업 예는 다음과 같습니다.

가장 좋아하는 음식은 무엇입니까?
피자 아이스크림 그린 달걀과 햄

브라우저는이 마크 업을 그림과 같이 세 가지 항목이있는 드롭 다운 목록으로 바꿉니다.

사용자가 목록의 기본 설정을 변경하여 드롭 다운 목록에서 하나 이상의 항목을 선택할 수있게 할 수도 있습니다:

독립형 속성에 값을 제공하면 해당 값은 속성 자체의 이름과 동일해야합니다 (즉, multiple 및 multiple = "multiple"이 모두 유효 함).

기본적으로 브라우저는 사용자가 드롭 다운 메뉴 화살표를 클릭하여 나머지 목록을 표시 할 때까지 하나의 옵션 만 표시합니다. 태그와 함께 size 속성을 사용하여 표시 할 옵션의 수를 지정하십시오.

총 옵션 수보다 적게 지정할 경우 브라우저에는 드롭 다운 목록과 함께 스크롤 막대가 포함됩니다.

확인란을 선택하거나 라디오 버튼을 지정할 수있는 것처럼 브라우저가 페이지를로드 할 때 드롭 다운 목록의 옵션 중 하나를 이미 선택하도록 지정할 수 있습니다. 원하는 태그에 대해 선택한 속성을 기본값으로 추가하기 만하면됩니다. 사용자가 기본 선택을 쉽고 빠르게 무시할 수 있다는 것을 알고 있다면 선택의 가능성이 매우 높을 때 이것을 사용하십시오.