앱 만들기/HTML5 study

드롭다운 리스트 태그

나도처음이야 2023. 5. 2.
반응형

하기와 같은 드롭다운 리스트 를 만들어 보겠습니다.

드롭다운 리스트

드롭다운 을 만들어주는 태그는 바로 <select> 입니다.

소스를 구현해 봅니다.

<body>
  <label for="colors">좋아하는 색상을 선택하세요:</label>
    <select id="colors" name="colors" >
      <option value="red">빨간색</option>
      <option value="green">초록색</option>
      <option value="blue">파란색</option>
      <option value="yellow" selected>노란색</option>
</select>

<select> 태그로 리스트를 감싸 주며,

리스트 항목들은 <option>태그를 사용 합니다. 

사용자가 선택한 옵션은 name 속성에 지정된 값으로 서버로 전송 됩니다.

이상 드롭다운 목록을 <select> <option> 태그로 만들어 보았습니다.

감사합니다.

반응형

'앱 만들기 > HTML5 study' 카테고리의 다른 글

<ins> , <del>태그 예제  (1) 2023.05.04
인용문을 나타내는 태그  (2) 2023.05.03
<textarea> 태크 예제  (2) 2023.04.26
input type="hidden" 예제 만들기  (1) 2023.04.24
input type="week" 주 제한 하기  (4) 2023.04.22

댓글