CSS スタイルを導入するにはどのようなタグが使用されますか?

CSS スタイルを導入するために使用されるタグは「」です。リンク タグは、ドキュメントと外部リソース間の関係を定義するために使用されます。最も一般的な使用法は、外部 CSS スタイル シートにリンクすることです。構文は「」です。 。ページが読み込まれると、link タグによって導入された CSS スタイルも同時に読み込まれます。

このチュートリアルの動作環境: Windows 7 システム、CSS3&&HTML5 バージョン、Dell G3 コンピューター。

CSS スタイルを導入するために使用されるタグは「」です。

CSS 外部スタイル シートは、ブラウザーで認識および解析できるようにする前に、Web ドキュメントにインポートする必要があります。外部スタイル シート ファイルは、2 つの方法で HTML ドキュメントにインポートできます。

• タグを使用して紹介します

• @import キーワードを使用して

# を紹介します## 以下 この記事では タグについて詳しく説明します。

タグは、ドキュメントと外部リソース間の関係を定義します。最も一般的な使用法は、スタイル シートをリンクすることです。

注:

• HTML では、 タグには終了タグがありません。

• XHTML では、 タグを適切に閉じる必要があります。

link タグを使用して CSS スタイルを導入する構文

各属性の説明:

• href 属性は、外部スタイル シート ファイルのアドレスを設定します。これは、相対アドレスまたは絶対アドレスにすることができます。

• rel 属性は、関連するドキュメントを定義します。ここでは、関連するドキュメントがスタイル シートであることを示します。

• type 属性はインポートされるファイルのタイプを定義します。style 要素と同様に、text/css は CSS テキスト ファイルを示します。

注:

一般に、 タグを定義するときは、上記の 3 つの基本属性を定義する必要があり、そのうちの href は属性を設定する必要があります。

リンク要素に title 属性を追加して、オプションのスタイル シートのタイトルを設定することもできます。つまり、Web ドキュメントが複数のスタイル シートをインポートするときに、適用するスタイル シート ファイルを選択できます。タイトル属性値。

title 属性は rel 属性に関連しています。W3C 組織の計画によると、将来の Web ドキュメントでは、複数の 要素を使用して、スタイル シート ファイル、スクリプト ファイル、カスタマイズした追加の補足ファイルを含めることもできます。さまざまな種類と名前の非常に多くのファイルをインポートした後、title 属性を使用して選択できます。このとき、rel 属性の役割が明らかになります。Web ページ ファイルが最初にインポートされるときに適用されるインポートされたファイルの種類を指定できます。表示されます。現在、CSS とのみ関連付けることができます。スタイル シート タイプ。

外部スタイルは、CSS アプリケーションに最適なソリューションです。スタイル シート ファイルは、複数の Web ページから参照できます。同時に、インポートするリンク要素を繰り返し使用することで、Web ページ ファイルに複数のスタイル シートをインポートできます。さまざまなスタイルシート、ドキュメント。

拡張知識: link と @import の違い

1. 依存関係の違い

@import は CSS が提供する文法規則であり、スタイルのみをインポートします テーブルの役割; リンクは HTML によって提供されるタグであり、CSS ファイルを読み込むだけでなく、RSS、rel 接続属性などを定義することもできます。

2. 読み込み順序の違い

ページ読み込み時にlinkタグで導入されたCSSも同時に読み込まれますが、@importで導入されたCSSはページの後に読み込まれます。ロードされています。

3. 互換性の違い

@import は CSS2.1 でのみ使用できる構文であるため、IE5 でのみ認識できます; link タグは HTML 要素であり、互換性の問題はありません。

4. DOM 制御性の違い

JS で DOM を操作し、リンクタグを挿入してスタイルを変更できますが、DOM メソッドはドキュメントに基づいているため、@import を使用して挿入することはできませんスタイル。

(学習ビデオ共有:

css ビデオ チュートリアル 、Web フロントエンド )

以上がCSS スタイルを導入するにはどのようなタグが使用されますか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。