2

<label>現在、<input>IE7のバグを修正しているため、ディスカッションを行ってい<p>ます。

タグに含まれるタグの正しいセマンティクスに関するドキュメントが見つからないようです<form>。たとえば、次のように使用する傾向があります。

<form action="" method="post">
  <fieldset>
    <div class="formrow">
      <label for="firstname">Firstname:</label>
      <input type="text" id="firstname" name="firstname" />
    </div>
  </fieldset>
</form>

ただし、Zurb Foundationを見ると、おそらくスタイルのために、要素をまったくラップしていませんが、有効ではないradioと思われる内部checkboxを配置しています。Zurbのページはそう使ってるけど、あちらで有効なのかな?<input><label>HTML5

Twitter Bootstrapは、<div>私のような二重ラップ アプローチを採用する傾向があります。しかし、やはり、入力radiocheckbox入力をラベル内にラップします。

<form>それで、私の質問に対して、タグ内の要素のセマンティクスに関する決定的なルールはありますか?

4

3 に答える 3

1

フォーム要素の子孫として許可されている要素を知りたい場合は、HTML4 仕様のフォーム セクションを参照することをお勧めします(または同等のHTML5 セクションを参照してください)。

たとえば、内では任意のインライン要素を使用できます<label>:

<!ELEMENT LABEL - - (%inline;)* -(LABEL) -- form field label text -->

input要素が要素内にある理由はlabel、説明テキストをクリックするとチェックボックスの状態も切り替わるためです。for属性を適切に設定することで、同じことを達成できます。

于 2011-12-14T15:05:17.200 に答える
0

フィールドセット要素に必要な凡例要素が含まれていないため、サンプルのマークアップは無効なXHTML1.0です。HTML5では正しいでしょうが、action = ""属性は許可されていません(アクション属性値は空であってはなりません)。

ただし、実際には、フィールドセットのマークアップは無意味です。この要素はフィールドのグループ化に役立ちますが、サンプルにはグループ外のフィールドは含まれていません。XHTML 1.0の厳密なルールで要求されていますが、divマークアップも不要です。しかし、おそらく実際の形は異なります。クラス名「formrow」が示すように、複数の「行」がある場合、テーブル要素が最適なマークアップである可能性があります。

フィールドとそのラベルをコンテナー要素でラップする理由は3つあります。HTML4.01StrictおよびXHTML1.0Strictルール(フォーム内のすべてをブロックレベルのコンテナーでラップする必要がある)を満たすため、スタイル設定を可能にするためそれらを全体として、そしてクライアント側のスクリプトでそれらを1つの単位として扱いやすくするために。そのようなラッピングのために、

  • divは意味的に空の要素であり、多くの場合便利です
  • フィールドセットは論理的かもしれませんが、古いルールによる凡例が必要であり、デフォルトで特別な種類の境界線が作成されます
  • pはHTML5ルール(段落の概念を自由に解釈する)では問題ありませんが、divと比較してほとんど何も勝ちません。むしろ、デフォルトの上下の余白が大きすぎることを意味する場合があります。
于 2011-12-14T18:28:09.340 に答える
0

ここで説明されているように使用する必要があります: http://www.w3schools.com/html5/tag_fieldset.asp 例: http://www.w3schools.com/html5/tryit.asp?filename=tryhtml5_fieldset

オプションで、入力フィールドの「説明」を

<label>

エレメント。

<label for="name_of_inputfield">Name:</label>

を利用するのは良いスタイルであることに注意してください

<legend>

タグを使用している場合

<fieldset>
于 2011-12-14T15:06:11.223 に答える