チェックボックスで使われる要素

コードの意味がわからないの要素を調べてみる。

<fieldset>
    <legend>Select a maintenance drone:</legend>

    <div>
      <input type="radio" id="huey" name="drone" value="huey"
             checked>
      <label for="huey">Huey</label>
    </div>

    <div>
      <input type="radio" id="dewey" name="drone" value="dewey">
      <label for="dewey">Dewey</label>
    </div>

</fieldset>

出典
https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/radio

<fieldset>要素とは？

「FIELDSET」とは、<form>タグで定義するフォームの入力項目をグループ化するためのタグです。
グループ化を行うことにより、グループの間をtabキーで簡単に移動することが可能になります。
出典 https://html-coding.co.jp/annex/dictionary/html/fieldset/

<legend>要素とは？

「凡例」、「説明文」、「銘」などの意味を持ち、<fieldset>でグループ化されたフォームの入力項目に対して、タイトルを付けるためのタグです。
出典 https://html-coding.co.jp/annex/dictionary/html/legend/

<label>要素とは?

フォームの中でフォームの項目名と構成部品（チェックボックス、ラジオボタンなど）を関連付けるためのタグです。
関連付けを行うことにより、ブラウザでラベル（もしくはラベルのアクセスキー）をクリックした際に、その構成部品をクリックしたのと同じ動作が可能になります。

タグの指定方法には2つあり、1つは<label>タグのfor属性の値と、フォーム部品のid属性の値を同じにすることで両者の関連付けができます。
もう一つは、<label>～</label>内に部品とラベルを配置するという方法です。
ただし、この方法はInternet Explorer6以前のブラウザには対応していないので、できるだけ前者を用いた方がよいでしょう。
出典

<input>要素の属性

name

• 部品の名前を指定します。 文字列で指定
  出典

• ラジオボタンで、同じ name の値を持つ複数の選択肢から一つの値を選択することができます。
  出典
  https://developer.mozilla.org/ja/docs/Web/HTML/Element/input

id

すべての入力欄を含む、すべての要素で有効なグローバル属性で、文書全体で一意でなければならない一意の識別子 (ID) を定義します。その目的は、リンクする際に要素を識別することです。この値は、ラベルとフォームコントロールをリンクするための <label> の for 属性の値として使用されます。 を参照してください。
出典

value

部品の初期値を指定します。 文字列で指定
出典

checked