CSS 全体レイアウト宣言を使用するためのヒント_体験交換

PHP中文网
リリース: 2016-05-16 12:07:15
オリジナル
1375 人が閲覧しました

良いコーディング習慣を身につけるべきです。css 全体のレイアウト宣言は、コードを簡素化し、操作効率を向上させる方法を提供します。より一般的に使用される形式をリストし、説明を追加します。全体的なレイアウト宣言の機能は、全体としての目標を要約し、後続のコードの各タグで個別に定義する必要を避けるために、いくつかの同一または基本的に同じ属性と値を宣言することです。異なる属性と値がある場合は、後で再定義できます。

1. ワイルドカード全体のレイアウト ステートメント。

* { 
margin:0; 
padding:0; 
font-size:0.8em; 
... 
}
ログイン後にコピー

このタイプのステートメントはページ全体に適用されます。ページ要素に共通のプロパティを設定できます。各要素を個別に宣言する必要がなくなります。上記のコードでは、マージンとパディングをゼロ、フォント サイズを 0.8em と宣言しています。宣言された属性と値は、ページ上のすべての要素に適用されます。後続のコードでmargin、padding、font-sizeの値を再定義しない限り、この定義に従って表示されます。

2. タグ付き宣言全体

body { 
background:#fff; 
font-family: courier, "courier new", monospace; 
} 
或 
p { 
background:#fff; 
font-family: courier, "courier new", monospace; 
}
ログイン後にコピー

このタイプの宣言は、特定の xhtml タグ用です。特別な定義がない場合は、この記述が適用されます。本文の背景色とフォントを定義します。したがって、再度定義しない限り、本体内のすべての要素にそれが適用されます。段落 p の定義原則は同じです。

3. グループ全体のステートメント


h1,h2,h3 {color:#00f; font-weight:100;}
ログイン後にコピー

このタイプのステートメントは、h1、h2、h3 のテキストの色とフォントの追加を示します。大変な状況。実際の操作では、これは必ずしも当てはまりませんが、class または id のいくつかの xhtml 要素が同じ属性を持っている可能性があり、それらをグループ化してコーディングすることができます。一部の違いは個別に再定義できます。たとえば、この http://www.52css.com/article.asp?id=392 の例では、小さなアイコンを備えた新鮮な css フォーム デザインが示されています。このタイプの宣言を使用します。

上記は css 全体レイアウト宣言の使用スキルと経験交流コンテンツの一部ですが、その他の関連コンテンツについては、php 中国語 web サイト (www.php.cn) に注目してください。


関連ラベル:
ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート