HTML+CSS学習記(7) - CSSの基礎知識styles_html/css_WEB-ITnose

既存の HTML タグに直接記述されたインライン CSS スタイル

CSS スタイルはどこに記述できますか? CSS スタイルのコード挿入形式は、基本的にインライン、埋め込み、外部の 3 種類に分けられます。

インライン CSS スタイル シートでは、次のコードのように、CSS コードを既存の HTML タグに直接記述します。

<p style="color:red">这里文字是红色。</p>

の開始タグに記述する必要があることに注意してください。

<p>这里文字是红色。</p style="color:red">

と CSS スタイル コードを ダブルクォーテーションで囲んで記述します。CSS スタイル コードの設定が複数ある場合は、まとめて記述できます。セミコロンで区切ります。次のコード:

<p style="color:red;font-size:12px">这里文字是红色。</p>

現在のファイルに記述された埋め込み CSS スタイル

埋め込み CSS スタイル。つまり、CSS スタイル コードを af30778aa5684233cd74d6b939bc841f531ac245ce3e4fe3d50054a55f265927 タグ。たとえば、次のコードは 3 つの 45a2772a6b6107b401db3c9b82c049c2 タグ内のテキストを赤色に設定します:

<style type="text/css">span{color:red;}</style>

埋め込み CSS スタイルは c9ccee2e6ea535a969eb3f532ad9fe89531ac245ce3e4fe3d50054a55f265927 の間に記述する必要があります。次の埋め込み CSS スタイルは、93f0f5c25f18dab9d176bd4f6de5d30e9c3bca370b5104690d9ef395f2c5f8d1 の間に記述されます。

外部 css スタイル、別ファイルに記述

外部 css スタイル (外部スタイルとも呼ばれます) は、css コードを別の外部ファイルに記述することです。 この css スタイル ファイルには、拡張子が付いています。 「.css」。次のコードに示すように、93f0f5c25f18dab9d176bd4f6de5d30e 内で (c9ccee2e6ea535a969eb3f532ad9fe89 タグ内ではなく) 2cdf5bf648cf2f33323966d7f58a7f3f タグを使用して、CSS スタイル ファイルを HTML ファイルにリンクします。 🎜>

注:

<link href="base.css" rel="stylesheet" type="text/css" />

1. CSS スタイルのファイル名には、main.css などの意味のある英文字が付けられます。

2. rel="stylesheet" type="text/css" は固定の記述方法であり、変更することはできません。

3. 2cdf5bf648cf2f33323966d7f58a7f3fタグの位置は通常、93f0f5c25f18dab9d176bd4f6de5d30e内に記述されます。

3 つの方法の優先順位

同じ要素に同時に CSS スタイルを設定するために 3 つの方法を使用しましたが、実際にどの方法が効果的でしょうか? 3 つのスタイルには優先順位があります: inline > external > には、埋め込み CSS スタイルの位置が external の後ろにある必要があることに注意してください。 f87a5964fcebb93d98ebca11ba9d357bコードは 080b747a20f9163200dd0a7d304ba388...531ac245ce3e4fe3d50054a55f265927 コードの前にあります (これも同様です)。実際の開発で書かれています）。

---