반응형

section과 option으로 드롭다운 메뉴 만들기

 

1. 기본

  <div>
    <label for="option">옵션을 선택해주세요</label>
    <select id="option">
      <option>옵션1</option>
      <option>옵션2</option>
      <option>옵션3</option>
      <option>옵션4</option>
      <option>옵션5</option>
    </select>
  </div>

 

 

2. name과 value

  <div>
    <label for="option">옵션을 선택해주세요</label>
    <select name="option_selction" id="option">
      <option value="옵션1">옵션1</option>
      <option value="옵션2">옵션2</option>
      <option value="옵션3">옵션3</option>
      <option value="옵션4">옵션4</option>
      <option value="옵션5">옵션5</option>
    </select>
  </div>

value : 서버에 넘어갈 데이터

 

3. required와 disabled

  <div>
    <label for="option">옵션을 선택해주세요</label>
    <select name="option_selction" id="option" required>
      <option value="옵션1">옵션1</option>
      <option value="옵션2">옵션2</option>
      <option value="옵션3">옵션3</option>
      <option value="옵션4">옵션4</option>
      <option value="옵션5" disabled>옵션5</option>
    </select>
    <input type="submit">
  </div>

required : 설문조사시 옵셥을 필수로 선택해야 다음 페이지로 넘어갈 수 있다

disabled : 옵션 5를 선택할 수 없다

반응형

+ Recent posts