ホームページ  >  記事  >  ウェブフロントエンド  >  HTMLのDiv、span、labelタグの違い

HTMLのDiv、span、labelタグの違い

巴扎黑
巴扎黑オリジナル
2017-06-27 11:38:213040ブラウズ

pとspan

初めてp+cssレイアウトを学ぶとき、誰もが多くの混乱を感じると思いますが、pとspanの使用には特定の「有機体」があまりないように感じます。 w3c の p について の定義: 分割ドキュメント構造としての p は、当然、最も正式なセマンティクスになりますが、そのような公式のセマンティクスは、大きな構造には問題ありませんが、小さな場所では非常に混乱します。 、p を使用するか、span を使用するかは依然として混乱しています。実は、これを人々に突然理解させるのは、「Microsoft MSDN ライブラリ」 の定義です。

p: HTMLをレンダリングするコンテナを指定します

span: インラインテキストコンテナを指定します

平たく言えば、

に他のタグがある場合は、テキストのみの場合はspanを使用します。 p は、

HTML ドキュメント

内の大きなコンテンツ ブロックに構造と背景を提供するために使用されるブロック レベルの要素です。span は、行内の領域を定義するインライン要素です (つまり、行は複数の領域に分割できます) by )

span ラベルは p ラベルに埋め込むことができます (p は大きなコンテナ、span は小さなコンテナとみなすことができます。もちろん、大きなコンテナは小さなコンテナを保持できます)

spanとlabel


上記のspanに関する文では、cssスタイルなどを定義できますが、labelも使用できます。 2 つの違いは何ですか?

label タグ

は主にフォーム要素をバインドするために使用されます。

label タグ

をクリックすると、バインドされたフォーム要素が入力フォーカスを取得します

スパンは通常のフォーム要素です。文章。

例:



私のブログにアクセスしましたか





(ラジオではなくテキスト「はい」または「いいえ」を押してください)< /span>






実行結果:



1 つの質問:

accesskey 属性はショートカット キーの設定に使用されるのではありませんか?しかし、1 キーも Alt+1 キーも反応しません。何が起こっているのかわかりません。ラベル アクセス キーの使用方法について専門家が答えてくれることを願っています。




添付ファイル: ラベル label の具体的な使用法:

label はラベル マークとしてマークされます。このマークは、他のユーザー インタラクティブ コントロールとのバインドをサポートし、バインドされたコントロールに代わって対応するイベントをトリガーします。バインディング方法は、for 属性値を宛先コントロール (バインドされたコントロール) ID として指定します。通常の状況では、ラジオ ボタンや チェックボックス を使用するときにラベル バインディングを使用するのが一般的です。
Label の 2 つの属性は非常に便利です。1 つは for で、もう 1 つは accesskey です。
属性の場合:
機能: このラベルをクリックすると、HTML 要素 が Label タグにバインドされることを示します。 , バインドされた要素がフォーカスを取得します
使用法:

Accesskey 属性:

機能: ラベル タグにバインドされた要素にアクセスするためのホットキーを表します。ホットキーを押すと、バインドされた要素がフォーカスされます。
使用法:

制限事項: ショートカットaccessKey 属性で設定されたキーはブラウザのショートカット キーと競合することはできません。競合しない場合は、優先 またはブラウザのショートカット キーが優先されます。

注:
LABEL を別のコントロールにバインドするには、LABEL 要素の FOR 属性をコントロールの ID と同じ
に設定します。 LABEL をコントロールの NAME プロパティにバインドしても役に立ちません。ただし、フォームを送信するには、LABEL 要素がバインドされているコントロールの名前を指定する必要があります。 指定したショートカットキー


下線を追加する方法は2つあります。 LABEL 要素のリッチ テキスト サポートにより、ACCESSKEY 属性で指定されたアクセラレータ文字の両側に U 要素を追加できます。スタイルシート (CSS) を使用してスタイルを適用したい場合は、SPAN に文字を含めて、"text-decoration" を使用してスタイルを設定できます。 ユーザーが LABEL をクリックすると、まず LABEL の onclick イベントがトリガーされ、次に htmlFor 属性で指定されたコントロールの onclick イベントがトリガーされます。 LABEL で設定したショートカット キーを押すと、

タグはネストできません。
この要素は、Internet Explorer 4.0 以降の HTML およびスクリプトで使用できます。ラベル




を閉じる必要があります。

以上がHTMLのDiv、span、labelタグの違いの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。