레이아웃(Layout)
CSS 레이아웃
점선 테이블1
점선 테이블2
메타(Meta)
이미지맵(image map)
아이프레임(iframe)
입력양식(form)
텍스트 필드(Text Field)
패스워드(Password Field)
텍스트에어리어(textarea)
셀렉트박스(select)
체크박스(Check Box)
라디오버튼(Radio Button)
리셋버튼(Reset Button)
전송버튼(Submit Button)
이미지 버튼(Image Type)
파일(File Form Control)
히든 필드(Hidden Field)
label
autocomplete
배경음악
필드셋(Fieldset)
마퀴(Marquee)
HTML과 XHTML
오브젝트(Object)
셀렉트박스(select)

콤보박스라고도 하며 Pull-Down Menus라고 표현하기도 합니다.

<select name="job">
    <option value="">직업선택</option>
    <option value="학생">학생</option>
    <option value="회사원">회사원</option>
    <option value="기타">기타</option>
</select>

<select>태그와 <option>태그로 구성됩니다.

<option> 태그에서 사용하는 value 속성은 텍스트 필드에서의 value 속성과는 조금 틀립니다. 텍스트 필드에서 value 속성에 값을 입력하면 기본값이 입력되지만 <option> 태그의 경우는 이 <option>이 선택된 경우 전송되는 값을 지정하는 것입니다.

위의 예제에서 학생을 선택된채로 폼을 전송했다면 job 필드의 value값은 <option value="학생">의 value값인 "학생"으로 지정됩니다.

기본값으로 회사원이 선택되게 할려면 selected 속성을 사용해야 합니다.

<select name="job">
    <option value="">직업선택</option>
    <option value="학생">학생</option>
    <option value="회사원" selected="selected">회사원</option>
    <option value="기타">기타</option>
</select>

아래와 같이 회사원이 선택된채로 출력됩니다.

<optgroup>은 HTML 4 버전에서 새로 만들어진 태그로 옵션에 카테고리를 만들 수 있습니다. 대부분의 웹브라우저에서 지원하고 있다.

<select name="hobby">
     <option value="독서">독서</option>
     <optgroup label="스포츠">
        <option value="야구">야구</option>
        <option value="축구">축구</option>
     </optgroup>
     <option value="음악감상">음악감상</option>
</select>

스포츠라는 카테고리를 만들고 야구와 축구 옵션을 추가하였습니다.

Copyright © Homejjang.com All rights reserved.