1. CSS の概要
CSS は、HTML ドキュメントのスタイルを表現するために使用される言語である Cascading Style Sheets を指し、このスタイルは Web ページのパフォーマンスと構造を完全に分離することができる HTML 要素の表示方法を定義します。スタイルデザイン言語。 スタイルは通常スタイル シートに保存され、外部スタイル シートは通常 CSS ファイルに保存され、複数のスタイル定義を 1 つにカスケードできます。
HTML タグは、コードの可読性を高め、Web ページの構造と表示の分離の原則を実現するために、文書の内容、つまり文書の構造を定義するために設計されています。 HTML の標準化を担当し、HTML4 以外のスタイルを作成します。 CSS の最新バージョンは CSS3 です。従来の HTML のパフォーマンスと比較して、CSS は Web ページ内のオブジェクトの位置とレイアウトをピクセル レベルで正確に制御でき、保守と修正が容易です。 CSS を使用したページのレイアウトは、現在、テキスト表示に基づいた最高のパフォーマンスのデザイン言語です。
CSS スタイル シートは作業効率を大幅に向上させます。スタイルは通常、外部の .css ファイルに保存されます。外部スタイル シートには、単純な CSS ドキュメントを編集するだけで、サイト内のすべてのページのレイアウトと外観を変更する機能があります。同時。
2. CSS 構文
CSS ルールは、セレクターと 1 つ以上の宣言の 2 つの主要な部分で構成されます。 以下の通り:
1 p{2 color:red;3 text-indent:2em;4 }セレクターは、スタイルを変更する必要がある HTML 要素です。 各宣言は属性と値で構成されます。属性は設定されたスタイル属性であり、属性と値はコロンで区切られます。 CSS 宣言は常にセミコロンで終わり、宣言のグループは中かっこ {...} で囲まれます。 CSS を読みやすくするには、1 行に 1 つのプロパティのみを記述します。
CSS コメントはコードを説明するために使用され、ブラウザーはそれを自由に編集できます。 CSS コメントは「/*」で始まり「*/」で終わります。 以下の通り:
1 p{2 color:red;3 text-indent:2em; /* 段落缩进2个字，即段落开头空2个汉字的位置。 */4 }3. CSS を作成します
スタイルシートが読み取られると、ブラウザはそれに応じて HTML ドキュメントをフォーマットします。 CSS スタイルシートを作成するには、インラインスタイル、内部スタイル、外部スタイルの 3 つの方法があります。
(1), inline style
インライン スタイルは、インライン スタイルまたはインターライン スタイルとも呼ばれ、該当するタグ内の style 属性を使用して定義されます。 以下の通り:
<div style="width:200px;height:100px;border:1px solid black;"></div>
インライン スタイルは、プレゼンテーションとコンテンツを混合することにより、スタイル シートの利点の多くを失います。したがって、このメソッドは注意して使用する必要があります。たとえば、スタイルを要素に 1 回だけ適用する必要がある場合には、インライン スタイルを使用できます。インライン スタイルを使用するには、関連するタグ内でスタイル属性定義を使用する必要があります。スタイル属性には任意の CSS プロパティを含めることができます。
(2)、内部スタイル
内部スタイルは、埋め込みスタイルとも呼ばれます。つまり、文書内に埋め込みスタイル シートを作成します。内部スタイル シートを定義するには、