CSSファイルを外部接続する方法-CSSチュートリアル-php.cn

CSSファイルを外部接続する方法

藏色散人

リリース： 2022-12-30 11:12:51

オリジナル

10889 人が閲覧しました

外部 CSS ファイルをリンクする方法: 1. " "; 2. @import ルールを使用して外部 CSS ファイルをインポートします。

CSSファイルを外部接続する方法

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

推奨: css ビデオチュートリアル

外部 CSS ファイルを接続するには 2 つの方法があります

link タグを使用して外部 CSS ファイルをリンクします。

@import ルールを使用して外部 CSS ファイルをインポートします

1。リンクタグを使用する外部 CSS ファイルのリンク (リンク済み)

スタイルを多くのページに適用する必要がある場合、外部スタイルシートが理想的な選択肢になります。外部スタイルシートを使用すると、1 つのファイルを変更するだけでサイト全体の外観を変更できます。

外部スタイルシートをリンクします:

<head>
<link rel="stylesheet" type="text/css" href="theme.css" />
</head>
<link> 标签定义文档与外部资源的关系。
<link> 标签最常见的用途是链接样式表。

ログイン後にコピー

注: link 要素は空の要素であり、属性のみが含まれます。 link 要素は head セクションにのみ存在できますが、何度でも出現できます。

2. @import ルールを使用して外部 CSS ファイルをインポートします (インポート済み)

<style>
@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>

ログイン後にコピー

リンクとインポートの違い

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

link が CSS を参照する場合、同時にロードされます。ページがロードされるとき、@import ではロード後にページが完全にロードされる必要があります。

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

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

@import は他のスタイルシートを CSS ファイルに導入できますが、リンクはそれをサポートしていません。

以上がCSSファイルを外部接続する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。