ラジオボタンで「ラベル」を使用する

ラジオボタンで「ラベルの」パラメータを使用する場合、508準拠 *となるため、次の点は正しいですか？

 <label for="button one"><input type="radio" name="group1" id="r1" value="1" /> button one</label> 

それともこれ？

 <input type="radio" name="group1" id="r1" value="1" /><label for="button one"> button one</label>

私が尋ねる理由は、2番目の例では、「ラベル」はテキストのみを含み、実際のラジオボタンは含まないということです。

* 1973年のリハビリテーション法の第508条では、連邦政府機関が障害を持つ人々にソフトウェアとWebサイトのアクセシビリティを提供することを義務付けています。

もうすぐだ。それはこれでなければなりません：

<input type="radio" name="group1" id="r1" value="1" />
<label for="r1"> button one</label>

の値forは、ラベルを付ける要素のIDである必要があります。

どちらの構造も有効でアクセス可能ですが、for属性はid入力要素のと同じである必要があります。

<input type="radio" ... id="r1" /><label for="r1">button text</label>

または

<label for="r1"><input type="radio" ... id="r1" />button text</label>

このfor属性は2番目のバージョン（入力を含むラベル）ではオプションですが、IIRCでは、含まれていない限り、ラベルテキストをクリック可能にしない古いブラウザーがいくつかありました。最初のバージョン（入力後のラベル）は、隣接する兄弟セレクターを使用してCSSでスタイルを設定する方が簡単です+。

input[type="radio"]:checked+label {font-weight:bold;}

（最初に説明した他の回答読んforで<label></label>まあ。タグを、両方のトップの答えは正しいですが、私の挑戦のために、それはあなたがいくつかのラジオボックスを持っているとき、あなたは彼らのために選択するべきだった共通名を同じようname="r1" で異なるIDを持ちます id="r1_1" ... id="r1_2"

したがって、この方法で答えがより明確になり、名前とIDの間の競合も削除されます。

ラジオボックスのオプションごとに異なるIDが必要です。

<input type="radio" name="r1" id="r1_1" />

       <label for="r1_1">button text one</label>
       <br/>
       <input type="radio" name="r1" id="r1_2" />

       <label for="r1_2">button text two</label>
       <br/>
       <input type="radio" name="r1" id="r1_3" />

       <label for="r1_3">button text three</label>