2019年7月29日
カスケーディングスタイルシート1. CSS（Cascading Style Sheets）を意味
スタイルは、HTML要素を表示する方法を定義します
スタイルは、通常のスタイルシートに格納されています
コンテンツの分離の問題を解決するため、プレゼンテーションにHTML 4.0にスタイルを追加します
外部スタイルシートを大幅に効率を向上させることができます
外部スタイルシートは通常、CSSファイルに格納され
スタイルは、複数の積層体として定義することができます
2.一般的に、以下のルールに基づいて、すべてのパターンが優先順位の低い順に配置された仮想新しいスタイルシートに積層されています。
デフォルトのブラウザの設定
外部スタイルシート
（内部の<ヘッド>タグ内の）内部スタイルシート
（HTML要素の中に）インラインスタイル
前記セレクタは、同じグループにグループ化することができる同じセレクタ宣言を共有することができます。
H1、H2、H3、H4、H5、H6 {
色：緑;
}
4.子孫セレクタは、ドキュメントのコンテキストに基づいてラベルのスタイルを決定します。
H2強いです{
青色;
}
<H2>これ小見出しも赤です。</ H2>
<h2は>この小見出しで強く強調した言葉があるの<strong>ブルー</ strong>の。</ H2>
5. IDセレクタは、特定のスタイルを指定する特定のHTML要素IDで標識することができる、「＃」が定義されています。
id属性は、各HTML文書に1度だけ表示することができます。
#red {色：赤;}
<PのID = "赤">この段落は赤です。</ P>
6. IDセレクタは、多くの場合、子孫セレクタを作成するために使用されます。
要素のもサイドバーIDは一度だけ文書に現れることができ、IDセレクタ子孫セレクタは、何回としても使用することができます。
#sidebarのP {
フォントスタイル：イタリック;
テキスト整列：右;
}
#sidebarさh2 {
フォントサイズ：1EM。
フォント重量：ノーマル;
}
7. IDセレクタは、子孫セレクタを作成するために使用されていない場合、それはまた、独立して動作することができます。
div＃サイドバー{
国境：1pxの破線の＃000;
パディング：10pxの;
}
CSS 8.、ドットで示したクラスセレクタ：
.center {テキスト整列：センター}
注意：最初の文字クラス名は、デジタルを使用することはできません！これは、MozillaやFirefoxで動作することはできません。
図9は、そのクラスに基づいて、クラスを選択することができる、派生セレクタクラスセレクタとして使用することができます。
.fancyのTD {
色：＃1 F60;
背景：＃666;
}
td.fancy {
色：＃1 F60;
背景：＃666;
}
10.属性セレクタ：スタイルプロパティは、HTML要素を指定しているように設定することができます。
注意:!のみ指定DOCTYPE、IE7とIE8のサポート属性セレクタのみ。IE6とそれ以前のバージョンでは、選択されたプロパティをサポートしていません。
CSSセレクタリファレンスマニュアル
| セレクタ |
説明 |
| 指定された属性を持つ要素を選択します。 |
|
| 指定された属性と値を持つ要素を選択します。 |
|
| 要素指定された単語に含まれる属性値を選択します。 |
|
| 指定された値で始まるようになる要素の属性値を選択するため、この値は、全体の単語でなければなりません。 |
|
| 各要素は、属性値の先頭に指定した値と一致しました。 |
|
| それぞれのマッチング要素は、属性値の指定した値で終わります。 |
|
| 指定された値に含まれる各要素の属性値に一致します。 |
11.挿入し、スタイルシート法：
11.1 Waibuyangshibiao
スタイルが多くのページに適用されている場合は、外部スタイルシートを使用する必要があります。外部スタイルシートの場合、一つのファイルを変更することで、サイト全体の外観を変更します。各ページには、スタイルシートにリンクする<link>タグを使用しています。<link>タグ（文書）：ヘッダ
<ヘッド>
<リンクのrel = "スタイルシート" タイプ= "テキスト/ cssの" のhref = "mystyle.css" />
</ head>の
外部スタイルシートは、任意のテキストエディタで編集することができます。ファイルは任意のHTMLタグを含めることはできません。スタイルシートの名前で.cssの拡張子を保存する必要があります。プロパティ値と単位の間にスペースを残さないでください。ここでは、スタイルシートファイルの例です。
時間{色：シエナ;}
P {マージン左：20ピクセル;}
本体{背景画像：URL（ "画像/ back40.gif"）;}
11.2内部スタイルシート
ときに単一の文書には、内部スタイルシートを使用して、特別なスタイルが必要です。スタイルシート内の文書ヘッダで定義された<スタイル>タグを使用します。
<ヘッド>
<スタイルタイプ= "テキスト/ cssの">
時間{色：シエナ;}
P {マージン左：20ピクセル;}
本体{背景画像：URL（ "画像/ back40.gif"）;}
</スタイル>
</ head>の
11.3インラインスタイル内
インラインスタイルを使用して、関連する属性タグにスタイル（スタイル）を使用します。スタイル属性は、任意のCSSプロパティを含めることができます。
表示したいとコンテンツを一緒に混合するので、インラインスタイルは、スタイルシートの外に多くの利点を失います。この方法は、例えば、のみ適用される必要は注意して使用する場合、一度一つの要素でスタイル。
<Pスタイル=「色：シエナ;マージン左：20ピクセル」>
これは段落です
</ P>
12.背景色は、（すべてのバックグラウンド特性が継承されない）継承された透明なデフォルトすることができません。そこ透明「透明」を意味します。要素が背景色を指定していない場合言い換えれば、背景が透明であるので、その祖先要素の背景が見えます。
13.必要な背景、背景画像のプロパティに画像を置きます。デフォルト背景画像属性は、バックグラウンド上に配置される任意の画像を示すことなく、いずれでもありません。背景要素のほとんどは、身体に適用されるが、これらに限定されません。
次の例では、段落は、出願書類の残りの部分を持っている背景、背景を適用しません。
p.flower {背景画像：URL（/i/eg_bg_03.gif）;}
次の例は、背景画像のためのライン内に配置された背景画像リンク要素として設けられていることができます。
a.radio {背景画像：URL（/i/eg_bg_07.gif）;}
14.ことができます背景リピートプロパティを使用して、ページ上のタイルの背景画像が必要な場合。
背景画像として、過去の慣例があるとしてイメージリピートリードの属性値は、水平方向と垂直方向にメッキが施されています。それぞれ-Xを繰り返し、繰り返し-Yを、唯一の水平または垂直方向に繰り返さ画像につながる、非繰り返し画像タイルは、いずれの方向にも許容されません。デフォルトの左上隅、最初から要素の背景画像。
15.背景位置属性は、バックグラウンドで画像の位置を変更するために利用することができます。キーワード：上、下、左、右とセンター。長さの値は、最終的なパーセント値を使用することができる、例えば100ピクセルまたは5センチメートルとして、使用することができます。
これは、要素や画像の割合の両方に適用されます。つまり、画像は50％〜50％の点（中心点）として記載されている要素に記載されているが50％整列している点（中心点）の〜50％です。二つの値は、それぞれ水平方向と垂直方向である場合。唯一のパーセント値は、この値は、水平、垂直値の値として提供される場合、50％であると仮定されます。
オフセット値の左上隅の長さは、素子領域のマージン内に解釈されます。オフセット点は、画像の左上隅です。これはパーセント値と異なっているが、左上隅の左上隅に互いにずれているので注意してください。換言すれば、画像のバックグラウンド位置宣言の左上隅を指定点が位置合わせされます。
16.文書がそうするとき、文書のスクロールダウンし、長い場合は、背景画像もスクロールします。文書は、画像を越えた位置までスクロールすると、画像が消えます。
これは、バックグラウンド付着特性をスクロールすることによって防止することができます。この属性により、画像は、可視領域に対して宣言することができる（固定）固定され、従って圧延によって影響されません。