導入されたコンテンツは、html5の<label>タグの属性の使用方法の詳細な分析です。このウェブサイトには、この記事の<label>タグの属性使用方法の詳細な分析が含まれており、記事の属性テクノロジーと知識に関連するHTML5ラベルタグを説明します。この点でいくつかのサポートとヘルプを提供してください！以下は詳細です。
導入されたコンテンツは、html5の<label>タグの属性の使用方法の詳細な分析です。
FreeCodeCampのHTMLチュートリアルのCreate a Set of Radio Buttonsでは、このパッセージを見ました。
入力要素のID属性の値と一致する値を使用して、ラベル要素の属性を設定することはベストプラクティスと見なされます。これにより、支援技術は、ラベルと子の入力要素の間にリンクされた関係を作成できます。
大まかな意味は次のとおりです。それを行う最良の方法は、 labelにforを追加することです。その値は、ラベルと入力の間に関連性を作成するためのinputタグのid属性の値と同じです。
同時に、次のようにサンプルコードが与えられます。
<！ - コード1-> <ラベル= indoor> <入力ID =屋内タイプ=ラジオname =屋内外>屋内</label>
コードでは、ラベルの属性値は入力のID属性値と同じです。このコードから、協会がどこにあるかはわかりません。
ラベルの属性の定義は次のとおりです。
for属性は、ラベルがバインドされるフォーム要素を指定します。
翻訳：for属性は、形式のどの要素がバインドされるかを指定します。
サンプルコード：
<！ - コード2-> <フォームアクション=/action_page.php> <入力タイプ=ラジオ名= gender id = gender value = male> <label for = male </label> <br> <入力タイプ=ラジオ名=女性値=女性> <女性>女性>女性>女性> label> label> <br> <入力タイプ=ラジオ名=ジェンダー= rabel = </label < value = submit> </form>
2つのコードを比較すると、見つけることは難しくありません。
ラベルタグと入力タグの包含関係は異なります。コード1のラベルと入力はインクルージョン関係に属し、コード2のラベルと入力は比較的独立しています。
ラベルと入力は、ページ上で異なって配置されています。 Chromeの開発者ツールを通じて、コード1の実行結果、ラベルタグが入力タグ、コード2の実行結果、ラベルタグ、および入力タグが並行していることを見つけることは難しくありません。
ラベルと入力は1つずつ対応します。ラベルのコンテンツをクリックすると、対応するシングルエンドボタンが選択されます。
2つのコードでラベルの属性を削除すると、前のポイント1とポイント2は変更されず、変更はポイント3です。コード1の操作結果については、ラベルの内容をクリックしても、ラジオボタンを選択できます。コード2は異なります。ラベルのコンテンツをクリックすると、ラジオボタンを選択できません。
コードの実行結果を簡単に比較した後、記事の開始時に引用されたパッセージが正しいことを確認できます。ラベルに属性を追加するこの練習は、コードの品質を向上させることができます。
HTML5の<label>タグの属性使用方法の詳細な分析はここにあります。このページのURLをブックマークしてくださいhttp://www.vevb.com/web/a/2018090496006.shtml次回にアクセスしてください。