ホームページ  >  記事  >  ウェブフロントエンド  >  Css+Div レイアウトの概要、_html/css_WEB-ITnose

Css+Div レイアウトの概要、_html/css_WEB-ITnose

WBOY
WBOYオリジナル
2016-06-24 12:33:231233ブラウズ

1. グループセレクター
説明: 複数の要素が同じスタイル属性を持つ場合、同じステートメントを呼び出すことができます。要素はカンマで区切られます。

p,td,li {
font-size: 12px;
2. 派生セレクター

説明: 派生セレクターを使用して、要素内の子要素のスタイルを定義できます。たとえば、
li Strong {

font-style: italic;
font-weight:normal; です。 li のサブ要素は、斜体モードを定義しますが、太字モードは定義しません。
説明: CSS レイアウトは主にレイヤー div を使用して実装され、div スタイルは「id セレクター」を通じて定義されます。まずレイヤーを定義します
< div id ="menubar" > 次に、スタイルシートで次のように定義します

; margin : 0px ;
;ここで、menubar は定義した div の名前です。その前に「#」記号を追加する必要があることに注意してください。
ID セレクターは、次のような派生もサポートしています:
#menubar p {

text-aglin : right ;

margin-top : 10px ;

このメソッドは主に、より複雑なレイヤーを定義するために使用されます。複数の派生子要素、
4. カテゴリ セレクター。 里 説明: CSS は、カテゴリ セレクターの定義を表すためにポイントを使用します。例:

.12px {

Text-Aglin: Center;
font-size: 12px;

ページ上で、 class="category name" メソッドを使用して次を呼び出します。
12px size font このメソッドはより柔軟であり、いつでも作成および削除できます。
5. リンクの定義 スタイル (擬似スタイル スタイル) と
の説明: CSS は、リンク スタイルを定義するために 4 つの擬似クラス、つまり、A: Link、A: Visite、a:hold、a: active を使用します。例:

a:link { フォントの太さ : 太字 ; テキストの装飾 : なし ; カラー : #c30 }
a:訪問済み { フォントの太さ : 太字 ; テキストの装飾 : なし ;
a: hover { font-weight : ball ; text-decoration : none ; color : #FFFFF }

上記のステートメントはそれぞれ「リンク」を定義します, 訪問したリンクに基づいて、マウスが上に停止したときとマウスがクリックされたときに「スタイル」が使用されます
上記の 4 つのスタイルが「欠落」している場合がありますが、順序が崩れることはありません。原理は、愛と憎しみの原理です。
それが愛と憎しみの原理で、愛の「l」はリンク、「v」は訪問、憎しみの「h」はホバー、「a」はアクティブという順序です。

6. セレクターを組み合わせて使用​​して、絶妙なデザイン効果を作成します。

美しいパターンを使用して、通常の順序なしリストの鈍い黒点を置き換えます。 まず、CSS ルールを使用して、カテゴリ属性のインベントリの順序なしリストを伝えます。

ul.inventory {

リスト形式 : ディスク URL(/images/common/lister2.gig)
}


コード