ホームページ > 記事 > ウェブフロントエンド > CSSのインポートとリンクの違いは何ですか
この記事の内容は CSS におけるインポートとリンクの違いについてです。必要な方は参考にしていただければ幸いです。
CSS におけるインポートとリンクの違い
タオバオのページでこれが書かれているのを見たとき、インポートはインポートを使用しますが、多くの Web サイトではインポートが使用されていますか? もちろん、比較的シンプルなページやトラフィックの多い Web サイトもありますか?それらの違いは何ですか? CSSはインポートとリンクどちらを使用した方が良いでしょうか?古典的なフォーラムと別の Web サイトから大まかなアイデアを得ました。
淘宝網の Web ページのほとんどがこのように書かれていることがわかりました
サンプル コード
<style type="text/css" media="screen"> @import url("http://www.divcss8.com/home/css/global/v2.0.css?t=20070518.css"); </style>
そして、多くの Web サイトでは次のように書かれています。このリンク
サンプル コード
<link rel="stylesheet" rev="stylesheet" href="default.css" type="text/css" media="all" />
Google、Baidu 163、その他の Web サイトは Web ページに直接記述されます
もちろん、リンクとインポートを使用する利点は次のとおりです。ただし、ネットワーク速度が比較的遅い場合は、読み込みが中断され、ページ レイアウト エラーが発生します。
これらの効果は同じです。
唯一の違いは、サービス オブジェクトは異なります
@import は CSS
を提供しますリンクは現在のページを提供します
Classic 一部のネチズンは、@import が最初に実行されると述べました。
外部参照 CSS における link と @import の違い
この 2 日間で、XHTML に CSS を読み込む方法をいくつか書き終えました。その中で、外部参照 CSS は次のように分類されます。 2 つの方法: link と @import。
基本的に、これら 2 つの方法は CSS ファイルを読み込むために使用されますが、それでも微妙な違いがあります。
違い 1: 祖先の違い。 LinkはXHTMLタグに属しており、@importは完全にCSSが提供するメソッドです。
リンク タグは、CSS のロードに加えて、RSS の定義、rel 接続属性の定義など、他の多くのことも実行できます。@import は CSS のみをロードできます。
違い 2: ロード順序の違い。ページが読み込まれるとき (つまり、ビューアで表示されるとき)、link によって参照される CSS は同時に読み込まれますが、@import によって参照される CSS は、ページが完全にダウンロードされるまで待ってから読み込まれます。そのため、@import が CSS をロードするページを閲覧すると、スタイルが表示されないことがあります (ちらつくだけです)。これは、ネットワーク速度が遅い場合には明らかです (Dream City で CSS をロードする方法は、@import を使用することです。私はダウンロードします)同時に Dream City Web ページを閲覧すると、上記の問題が発生します)。
違い 3: 互換性の違い。 @import は CSS2.1 で導入されたため、古いブラウザではサポートされていません。@import は IE5 以降でのみ認識されますが、リンク タグにはこの問題はありません。
違い 4: dom を使用してスタイルを制御する場合の違い。 JavaScript を使用して dom を制御してスタイルを変更する場合、@import は dom によって制御できないため、link タグのみを使用できます。
大まかに違いは次のとおりです (他に違いがある場合はお知らせください。追加します)。上記の分析から、リンク タグを使用する方がよいでしょう。
上記は、CSS におけるインポートとリンクの違いについての完全な紹介です。CSS3 チュートリアル について詳しく知りたい場合は、PHP 中国語 Web サイトに注目してください。
以上がCSSのインポートとリンクの違いは何ですかの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。