CSSリンクとインポートの違いは何ですか

違い: link は html タグに属し、@import は css によって提供されるメソッドです。link タグは css を導入するだけでなく他のこともできますが、@import は css を導入することしかできません。 IE5 でのみ使用可能 上記のみがサポートされており、リンク タグには互換性の問題はありません。

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

HTMLに外部CSSを導入する方法にはリンクタグと@importの2つがありますが、両者の違いは何でしょうか？

1. 所属の違い

@import はスタイルシートをインポートする機能のみを持つ CSS が提供する構文規則、link は HTML が提供するタグ, CSS ファイルをロードできるだけでなく、RSS、rel 接続属性などを定義することもできます。

2. 読み込み順序の違い

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

3. 互換性の違い

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

4. DOMの制御性の違い

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

[推奨チュートリアル: CSS ビデオチュートリアル ]

補足説明:

@import の書き方

<style type="text/css">
    @import &#39;style.css&#39; //Windows IE4/ NS4, Mac OS X IE5, Macintosh IE4/IE5/NS4不识别
    @import "style.css" //Windows IE4/ NS4, Macintosh IE4/NS4不识别
    @import url(style.css) //Windows NS4, Macintosh NS4不识别
    @import url(&#39;style.css&#39;) //Windows NS4, Mac OS X IE5, Macintosh IE4/IE5/NS4不识别
    @import url("style.css") //Windows NS4, Macintosh NS4不识别
</style>

その中で、@import url(style.css) と @import url("style.css") が最良の選択であり、ほとんどのブラウザーと互換性があります。バイト最適化の観点からは、@import url(style.css) が最も推奨されます。

リンクの書き方

<link href="style.css" rel="stylesheet" type="text/css">

さらに、リンクにはアイコンの導入など、他の用途もあります

<link rel="shortcut icon" href="/favicon.ico" type="image/x-icon" />

一般に、リンクは @import よりも優れており、強力です。リンク タグを使用することをお勧めします。@import メソッドは注意して使用してください。

プログラミング関連の知識について詳しくは、プログラミング ビデオをご覧ください。 ！

以上がCSSリンクとインポートの違いは何ですかの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。