HTML のグローバル属性とは何ですか?

百草
リリース: 2023-08-16 17:12:58
オリジナル
1802 人が閲覧しました

htmlグローバル属性には、class、id、style、title、lang、accesskey、tabindex、hidden、draggable、editable などが含まれます。これらの属性は、任意の HTML 要素に適用できます。グローバル属性は、インラインまたはタグ属性として、すべての HTML 要素で使用できる属性です。

HTML のグローバル属性とは何ですか?

# このチュートリアルのオペレーティング システム: Windows 10 システム、Dell G3 コンピューター。

HTML には、任意の HTML 要素に適用できるグローバル属性が多数あります。グローバル属性は、インラインまたはタグ属性として、すべての HTML 要素で使用できる属性です。

以下は、一般的な HTML グローバル属性の一部です:

1. class: 要素の 1 つ以上のクラス名を指定するために使用されます。クラス名を使用して、CSS 内の要素を選択およびスタイル設定できます。

<div>
  <p>这是一个段落。</p>
</div>
ログイン後にコピー

2. id: 要素の一意の識別子を指定します。通常、JavaScript の DOM 操作または CSS のセレクターに使用されます。

<div id="header">
  <1>这是标题</h1>
</div>
ログイン後にコピー

3. style: メタのインライン スタイルを指定します。 CSS プロパティを通じて要素のスタイルを設定します。

<p style="color: red; font-size: 16px;">这是一个红色的段落,字体大小为16像素。</p>
ログイン後にコピー

4. title: 要素の追加情報を提供します。 title 属性の値は、要素の上にマウスを置くと表示されます。

<a href="https://www.example.com" title="访问示例网站">点击这里</a>
ログイン後にコピー

5. lang: 要素内のコンテンツの言語を指定します。これは、スクリーン リーダーや多言語ページに役立ちます。

<p>这是英文文本。</p>
<p>这是中文文本。</p>
ログイン後にコピー

6. accesskey: 要素にキーボード ショートカットを割り当てます。指定したキーボード ショートカットを押すと、この要素にすぐにアクセスできます。

<button accesskey="s">保存</button>
ログイン後にコピー

7. tabindex: Tab キーで移動するときの要素の順序を指定します。 Tab キーを使用して、さまざまな要素間を移動できます。

<input type="text" tabindex="1">
<input type="text" tabindex="2">
<input type="text" tabindex="3">
ログイン後にコピー

8. hidden: 隠し要素。非表示の要素はページには表示されませんが、DOM には引き続き存在します。

<p hidden>这个段落被隐藏了。</p>
ログイン後にコピー

9. ドラッグ可能: 要素をドラッグできるかどうかを指定します。通常は、JavaScript のドラッグ アンド ドロップ操作で使用されます。

<img src="image.jpg" draggable="true">
ログイン後にコピー

10. editable: 要素の内容をユーザーが編集できるかどうかを指定します。編集可能なテキスト領域またはリッチ テキスト エディターを作成するために使用されます。

<div contenteditable="true">
  这个内容可以被编辑。
</div>
ログイン後にコピー

これは HTML グローバル属性のほんの一部であり、さまざまなシナリオで使用できる他にも多くの便利なグローバル属性があります。グローバル プロパティは開発者にさらなる柔軟性と機能を提供し、必要に応じて HTML 要素をカスタマイズおよび操作できるようにします。

以上がHTML のグローバル属性とは何ですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート