CSS スタイル シートを使用する 3 つの方法とは何ですか?

3 つの方法は次のとおりです。 1. インライン スタイル シート。style 属性を使用して CSS コードを HTML マークアップに直接追加します。 2. 内部スタイルシートの「

」タグ内にCSSスタイルを記述し、「

この記事の動作環境: Acer S40-51、HBuilderX.3.0.5&&css3 版、Windows10 Home 中国語版

(学習ビデオ共有: css ビデオ チュートリアル)

CSS スタイル シートを使用するには 3 つの方法があります:

• インライン スタイル シート

• 内部スタイルシート

• 外部スタイルシート

##インラインスタイルシート

<h1 style="color:red;">style属性的应用</h1>

例:

インライン スタイル シートの長所と短所:

• スタイル シート ファイルがなければ、ある時点で効率が向上します;

• style 属性を使用したスタイル効果は最も強力です他の導入方法から同じスタイル効果を削除することを上書きします。

• 複数の要素でスタイルを共有するのは難しく、コードの再利用には役立ちません;

• HTML と CSS コードが混在しているため、プログラマーや検索エンジンにとって読みにくくなっています。

##内部スタイル シート内部スタイル シートは、CSS スタイルを タグに記述し、< を使用します。 ;style> 宣言するタグ

#例:

##内部スタイルシートのメリットとデメリット

欠点: 内部スタイル シートが HTML ファイルに記述されているため、ページが不純で、ファイル サイズが大きく、Web クローラーが情報を取得しにくく、メンテナンスが困難です。スタイルはページ間で共有できません

#CSS スタイルが Web ページ ドキュメントの外部のファイルに配置されている場合、それはCSS スタイル シート ドキュメントは外部スタイル シートを表します。 実際、外部スタイル シートは拡張子 .css を持つテキスト ファイルです。 CSS スタイル コードをテキスト ファイルにコピーし、.css ファイルとして保存すると、それは外部スタイル シートになります。 以下は外部スタイル シートです:

外部スタイル シートの導入方法: HTML ファイルは、リンク タイプとインポート タイプという 2 つの方法で、拡張子 .css を持つスタイル シートを参照します。

1. CSS リンク スタイルリンク スタイルとは、CSS スタイル シートを外部で定義し、拡張子 .CSS を持つファイルを形成し、 タグ領域に配置する必要があります。

構文:

<link type="text/css" rel="styleSheet"  href="CSS文件路径" />

2. CSS インポート タイプ

インポート タイプは、@import

を通じて