凡例要素内のラベル要素のラップ

StackOverflow https://stackoverflow.com/questions/238996

  •  04-07-2019
  •  | 
  •  

質問

ラベル要素を凡例要素の中に入れる理由はありません（実際に考えたり、見たことがありません）。しかし、私が実装している設計では、そうするのは魅力的です。

私がやろうとしていることは次のとおりです：

<fieldset>
<legend><label for="formInfo">I would like information on</label></legend>
<select id="formInfo">
    <option value="Cats">Cats</option>
    <option value="Dogs">Dogs</option>
    <option value="Lolz">Lolz</option>
</select>
</fieldset>

Firefox3、Safari、Opera、IE6 / 7では期待どおりに動作し（ラベルをクリックすると対応する入力がフォーカスされます）、検証に合格しますが、既知の理由（アクセシビリティ？セマンティクス？ブラウザー問題）なぜこれを行うべきではないのか

役に立ちましたか？

解決

</fieldset>はどこにありますか？

意味的に、 legendはfieldset labelが単一のフィールドを記述するのと同じように、

フィールドセットは、意味的に関連するフィールドをグループ化するために使用されることになっています（たとえば、<！> quot; address <！> quot;フィールドセットには、通り、都市、国の入力フィールドがあります）。

フィールドセットに複数のフィールドがあると仮定すると、提案することは意味的に意味がありません-フィールドセットを説明する個別の凡例テキストを作成し、次に各フィールドのラベルを作成する必要があります。

フィールドが1つしかない場合、フィールドセットや凡例はまったく必要ありません。

したがって、基本的に、あなたがしていることをすべきではありません。

CSSルールまたはJavascriptイベントをアタッチするための追加の要素を追加する場合は、divやspanなどの一般的な要素を使用して、テキスト読み上げなどを混同しないようにすることをお勧めします非視覚ユーザーエージェント。

ie、つまりselectまたは<=>を入れることは、潜在的に誤解を招く可能性のあるセマンティック要素の誤用（この場合のようにわずかでも）に対して、アクセシビリティ/セマンティクス（事実上何も意味しません）に関して事実上中立です。テキスト読み上げブラウザでのレイアウトのベストケースシナリオを想像してみてください。テキストは2回読み上げられます。1回は凡例として、もう1回はラベルとして読み上げられます。 > quot; <！> quotに関する情報が欲しい;彼らに二度声を出して読む？特に、<=>コントロールの選択のコンテキストでのみ意味があるためです。

他のヒント

まあ、ラベル要素自体は問題ないようです-<！> quot; formInfo <！> quot;の説明です。要素なので、心配はありません。意味的には、しかし、これはlegend要素について何と言っているのでしょうか？これは、フィールドセット全体のキャプションになるはずです...

所属していません StackOverflow
scroll top