CSSスタイルシート及び優先度法則
3353 ワード
CSS:Cascading Style Sheets、スタイルシートを積層し、ページレイアウトと外観を変更します.HTMLは文書の内容を定義し、
コンポーネント:セレクタ、1つ以上の宣言.
選択:
スタイルを変更するHTML要素が必要です.
宣言:各宣言は、属性と値で構成されます.【宣言グループは{}で囲み、セミコロンで終わる】
p {color:red;text-align:center;}コメント:/*これはコメントです*/
idセレクタ:特定のid属性が付いたHTML要素のスタイルを指定し、
IDプロパティ:数値で始まることはできません.IDプロパティはHTMLドキュメントごとに1回しか表示されません.
#para1 /*id = "para1" */
{
text-align:center;
color:red;
}classクラスセレクタ:複数の要素で使用できる要素のセットのスタイルを説明します.CSSで「.」に表示されます.
p.center {text-align:center;} /* p class="center" */スタイルシート
外部スタイルシート:スタイルが多くのページに適用されるのに適しています.ファイルにhtmlラベルを含めることはできません.
/*HTML CSS ， */スタイルシートファイルの例:
hr {color:sienna;}
p {margin-left:20px;} /* ：20px， ：20 px，【 】*/
body {background-image:url(/images/back40.gif);} 内部スタイルシート:単一のドキュメントには特殊なスタイルが必要で、ラベルでドキュメントのヘッダに内部スタイルシートを定義します.</p>
<pre class="has"><code><head>
<style>
hr {color:sienna;}
p {margin-left:20px;}
body {background-image:url("images/back40.gif");}
インラインスタイル:表現と内容を混ぜ合わせると、スタイルシートの多くのメリットが失われますので、ご注意ください.
。
≪マルチスタイル|Multiple Style|emdw≫:いくつかのプロパティが異なるスタイル・テーブルで同じセレクタで定義されている場合、プロパティ値はより具体的なスタイル・テーブルから継承されます.
外部スタイルシート
h3
{
color:red;
text-align:left;
font-size:8pt;
} 内部スタイルシート
h3
{
text-align:right;
font-size:20pt;
}
内部スタイルシートを持つこのページが外部スタイルシートにリンクされている場合、h 3で得られるスタイルは、
color:red; text-align:right; font-size:20pt;せきそう
スタイルシートでは、スタイル情報をさまざまな方法で指定できます.スタイルは、単一のHTML要素、HTMLページのヘッダ要素、または外部のCSSファイルに指定できます.同じHTMLドキュメント内で複数の外部スタイルシートを参照することもできます.
一般的に、すべてのスタイルは、次のルールに従って新しい仮想スタイルテーブルに積層され、数字4が最も優先されます.
優先度が段階的に増加したセレクタのリスト:
いくつかの経験則:
CSS優先度法則: