CSSの（A）プレゼンテーション
セレクタ { 項目1：プロパティ値、 項目2：プロパティ値 ; ... } //例 P { テキストインデント：2EM ; / * 最初の行のインデント2つの文字* / 行の高さ：180％ ; / * 行テキストの180％より高い高さ* / }
（C）セレクター：「タグセレクタ」、「IDセレクタ」、「クラスセレクタ」、「複合セレクタ」、「疑似クラスセレクタ」
3.1：ラベルセレクタ - スコープ：文書全体がこのような文書全体のフォント、背景色、ハイパーリンクや他のスタイルの定義としてスタイルの基礎ベースとしての使用に適したラベルのすべてのスタイル定義を、過ごすことになります。
3.1.1：単一のラベル
1つの 本体 { 2 フォント：16pxに/ 1「微軟雅黒で」 ; / * に16pxに文書全体のフォント、テキスト1回マイクロソフトエレガントな黒のラインの高さ。* / 3 色：＃333 ; / * テキストの色* / 4。 背景色：#eee ; / * 背景色* / 5 }
3.1.2：複数のラベル
1つの H2、H1の { 2 カラー：＃F60 ; 3。 左テキストALIGN =：センター ; / * 水平にテキストを中央* / 4 文字間隔：2ピクセル ; / * テキストとの間の空間* / }
3.1.3：スペースで区切られた複数のタグは、タグの前にラベルの後ろにネスト即ち入れ子になった包含関係を表します。
PS：ここで注意すべきは、スパン内部のpを見つけるために、最初のスパンを見つけ、そのような次のpスパンとして右の説明から左にラベルを説明することで、セレクタはできるだけ入れ子にする必要があります。
1つの Pスパン { 2 カラー：＃C03 ; 3 フォントサイズ：1.1em ; / * テキストのライン内のテキストのサイズが1.1倍です。* / }
3.2：IDセレクタ -
IDセレクタ、ユニーク。HTMLのオブジェクトIDを再利用することができないユニークな、ID名の名前です。
先頭に「＃」へのidセレクタ。id名は、一度だけ使用することができます。
任意のラベルは、idとクラスの属性を持っています。
そのようなdivのためのユニークなパターンを作るために、DIVのid =「メイン」プロパティを追加するように、あなたは#main {}スタイルの方法を用いることができます。
#mainセレクタポイントIDを上記HTML内のオブジェクトに適用されるHTMLオブジェクトのスタイル=「メイン」。セレクタは、フックと同等です。
1 #main { 2 样式 3 } 4 5 <DIV ID =」メイン」> ... </ div>
3.3、クラスセレクタ
どのプログラムでクラスを表しますクラス。などが同様の特性で、グループで、のような人々を魅了しています。
構文は、「クラスの構造に基づいており、」はじまり、クラススタイルは、そのラベルの必要性によって呼び出すことができ、何度も使用することができ、それを組み合わせることもできます。
例えば、いくつかのクラスには、次のスタイルを定義します。
PS：
実際には、クラスは、特定の機能を持つ多くの部品として見ることができる、クラス部品の異なる組み合わせの効果を最大化するために達成することができますどのようなスタイルのhtmlを必要としています。オブジェクトは、すべてのHTMLクラススタイルが呼び出される使用することです。
私はそれ^ _ ^ビルディングブロックゲームで遊んでいる子供のように感じます
注：idとクラス名は、独自の定義であり、その数字で始めることはできません、唯一の文字で始まることができ、数字、アンダースコアを含めることができ、命名規則に従ってください。あなたは予約キーワードタグを使用することはできません。あなたのような "＃2"、 "本部"、 "＃さh1"、 "図3a" の形式を使用することはできません。
クラスは、最初の文字または文字と数字を取るために、属性と属性値の最適な組み合わせと命名されます。
1 .bg1 { 2 背景色：#CCC。 3 } 4 .bg2 { 5 背景色：#eee。 6 } 7 .color1 { 8 色：＃1 F99。 9 } 10 .color2 { 11 色：＃666。 12 } 13 .f18 { 14 のfont-size：18px ; 15 } 16 .f16 { 17。 フォントサイズ：16pxに、 18である } 。19 .p20 { 20は パディング：20ピクセル ; / * パディング* / 21である } 22である .m20 { 23は マージン：20ピクセル ; / * 余白* / 24 }
1 < H1 クラス= "カラー1のF18" > </ H1 > 2 < H2 クラス= "カラー2のF16" > </ H2 > 3 < DIV クラス= "BG1のP20のM20" > </ DIV > 4 < DIV クラス= "BG2 P20" > </ DIV >
3.4、複合セレクタ
混合物は、一般に、ID、クラス、タグセレクタです。
これは、ラベルのすべてを、次のidセレクタのスタイルを使用して、典型的なものです。
< DIV ID = "navlist" > < UL > < 李> < HREF = "＃" ID = "現在" > HTML教程</ A > </ 李> < 李> < HREF = "＃" クラス=」 CSS」> CSS教程</ A > </ 李> < 李> < HREF = "＃" > jQueryの教程</ A > </ 李> < 李> < HREF = "＃" > SEO教程</ A > </ 李> < 李> < HREF = "＃" >关于我</ A > </ 李> </ UL > </ DIV >
例えば、今、以下のすべてが同じスタイルを使用するラベルの下の下のID「navlist」のli UL、セレクタを書くことができます。
1 #navlist A ULのLi { 2 パターン 3 }
ラベルのスタイルは同じではありません、あなたはid属性やclass属性という考えを追加することができますしたい場合は、次のセレクタを使用することができます。
1 #navlist A UL＃現在のLi { 2 スタイル 3 } 4 ULのLi a.css #navlist { 5 パターン 6 }
そこ下位レベルのネストされた関係上のスペースもあり、これはクラスIDとの直接プロパティが同等のid =「現在」であるとのクラス=「CSS」があるである必要があります。
3.5、擬似クラスセレクタ -
だけ少なく使用するCSS2の擬似クラスセレクタにつながったハイパーリンクの擬似クラスをサポートしていIE6は、使用しているため、ほとんどです：擬似クラスセレクタこれを置きます。
擬似クラスとは何ですか？実際には、それ自体が存在しない場合、オブジェクトは、一定の条件の下でトリガされます。
例えば、四つの状態の合計へのハイパーリンクは：訪問の前に、ホバリング、現在、4訪れた疑似クラスの結果をクリックします。
ハイパーリンク4つの状態が、有効にする特定の書かれた順序を持っている必要があります。
1 A：リンク {} / * アクセスする前に* / 2 A：訪問 {} / * 訪問* / 3。 A：ホバー {} / * マウスオーバー*の/ 4。 A：アクティブ {} / * これをクリックします* /
ホバーでなければならない：後訪問::リンク、アクティブにでなければなりません、注後ホバー
信頼配列がある：L（リンク）OV（訪問 ）EH（ホバー）（アクティブ）TE、 すなわち、と（愛）と憎しみ（憎悪）二つの単語を総括するような
しかし、我々は、一般的に、4つの状態を定義していない、サイトのほとんどは、唯一のホバーを（後）スタイルは、他の三つの状態に同じではない場合に同一である必要があります。したがって、このスタイルは次のように定義することができます。
。1 A { 2 色：＃333 ; 3。 テキスト装飾：なしに ; / * 下線を付していない* / 4。 } 5。 A：ホバー { 6。 カラー：＃1 F30 ; 7。 テキスト装飾：下線 ; / * 下線付き* / 8 }
このブログ借り- http://www.mrszhao.com/post/30.html