# HTML 14. Radio input屬性與應用 / 單選

- 製作性別選擇功能應用：


- input type / radio:

在我們填入姓名之後，難免也會需要確認一下對方的真實性別:

      <input type="radio" name="gender" id="" />
      <label for="">男性</label>
      <input type="radio" name="gender" id="" />
      <label for="">女性</label>
      <input type="radio" name="gender" id="" />
      <label for="">others</label>

### HTML 如何判定 radio 為一組呢？

- 屬性的 name:

如上面的 code: gender 就是設定成一組的 radio，故可做到3選1

### 添加必填屬性 - required

- 屬性為必填項目，若沒選擇，sunmit 則會無法傳送出去

這邊提醒一下，required 屬性，在同層的 radio / name 只需要填寫其中一個 tag 就好了

      <input type="radio" name="gender" id="" required />
      <label for="">男性</label>
      <input type="radio" name="gender" id="" />
      <label for="">女性</label>
      <input type="radio" name="gender" id="" />

###### tags: `2022 網頁開發全攻略教程`