CSSのhrefとsrc、linkと@importの違いを詳しく解説

この記事では、主に href と src、link と @import の違いを紹介し、名詞の定義とアプリケーションのシナリオについて説明します。必要な友人が参考になれば幸いです。

href と src の違い:

href (ハイパーテキスト参照): ハイパーテキスト参照。一般的に使用されるタグには、参照される外部リソースにリンクするために使用される link、a などが含まれます。現在の要素または現在のドキュメントと、現在の属性で定義されている必要なアンカーまたはリソースとの間のリンクまたは関係を定義します。例:
<link href="style.css" rel="stylesheet" /> /code><code><link href="style.css" rel="stylesheet" />

src(source)：引入资源，引入的src的内容是页面必不可少的一部分。引入的内容会嵌入当前资源到当前文档元素定义的位置，常用的有：img、script、iframe等。如：
<script src="script.js"></script>

src(source): インポートされた src のコンテンツはページの重要な部分です。インポートされたコンテンツは、現在のドキュメント要素で定義された位置に現在のリソースを埋め込みます。一般的に使用されるものには、img、script、iframe などが含まれます。例:

<script src="script.js"></script&gt>

ページの読み込みと処理は、ブラウザがこれをダウンロード、コンパイル、実行する前に一時停止されます。ファイル (ブラウザーがこの要素を解析すると、ブラウザーのレンダリングが一時停止されます)。そのため、下部にある js ファイルをロードすることをお勧めします。 img タグも同様で、画像がフェッチされてロードされるまでブラウザは読み込みを一時停止します。 link と @import の違い:

どちらも CSS を外部参照する方法ですが、違いは次のとおりです:

違い 1

: link はロードに加えて XHTML タグですCSS、RSS などの他のトランザクションも定義できます。@import は CSS カテゴリに属し、CSS のみをロードできます。

違い 2

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

違い 3

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

違い 4

: リンクは、JavaScript を使用して DOM を制御してスタイルを変更することをサポートしていますが、@import はサポートしていません。

関連する推奨事項:

CSS3 の nth-child と nth-of-type の違いの詳細な説明

addEventListener と on の違いの詳細な説明

br と p の違いは何ですかHTML の DIV 🎜🎜

以上がCSSのhrefとsrc、linkと@importの違いを詳しく解説の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。