ホームページ >ウェブフロントエンド >CSSチュートリアル >これも外部スタイルです。@import とリンクの違いは何ですか?

これも外部スタイルです。@import とリンクの違いは何ですか?

yulia
yuliaオリジナル
2018-09-18 15:41:061848ブラウズ

インライン スタイル、インポート スタイル、リンク スタイルなど、HTML に CSS スタイルを導入する方法はたくさんあります。今日、この記事では、同じ外部スタイル リンク リンク スタイルとインポート インポートについて説明します。スタイルは何が違うのですか?困っている友達は参考にしていただければ幸いです。

CSS を外部から参照する 2 つの方法:

link メソッド:

<link rel="stylesheet" rev="stylesheet" href="CSS文件" type="text/css" media="all" />

@import メソッド:

<style type="text/css" media="screen">   
@import url("CSS文件");   
</style>

どちらも CSS を外部参照する方法ですが、いくつかの違いがあります。

違い 1: link は CSS をロードするだけでなく、RSS などの他のトランザクションも定義できます。 CSS のカテゴリに追加すると、CSS のみを読み込むことができます。

違い 2: リンクが CSS を参照する場合、ページのロードと同時にロードされます。@import では、ロードする前にページが完全にロードされる必要があります。

違い 3: link は XHTML タグであり、互換性の問題はありません。@import は CSS2.1 で提案されており、以前のバージョンのブラウザではサポートされていません。

違い 4: ink は Javascript を使用した DOM の制御をサポートしていますが、@import はサポートしていません。

補足: @importのベストな書き方

一般的に@import:

@import 'style.css' //Windows IE4の書き方は以下のとおりです。 / NS4、Mac OS によって認識されません 、Macintosh NS4 は

@import url('style.css') を認識しません //Windows NS4、Mac OS X IE5、Macintosh IE4/IE5/NS4 は
@ を認識しませんimport url("style.css") / /Windows NS4、Macintosh NS4 は認識しません
上記の分析から、@import url(style.css) と @import url("style.css") が最適な選択肢があり、ほとんどのブラウザと互換性があります。バイト最適化の観点からは、@import url(style.css) が最も推奨されます。


以上がこれも外部スタイルです。@import とリンクの違いは何ですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

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