??
1. カスケード スタイル シートとは何ですか?
CSS は Web ページ上のスタイルの表示を制御します
2. CSS を設定するいくつかの方法
インライン スタイル (インライン スタイル)
ラベルのスタイル属性を設定します
インライン スタイル シートを使用する場合、html4.01 標準では次の追加を推奨しています
理由: 新しいバージョンの html では、 CSSを使用するだけでなく、HTML内のXMLの表示効果を制御するためにtext/smlを使用するなど、他の方法も使用できます
欠点: 各タグで設定する必要があり、インラインスタイルシートはすべてのメディアで機能します
埋め込みスタイル シート
外部スタイル シートをバッファを使用すると、Web ページの読み込みを高速化できます
利点: Web ページをスリムにすることができます
スタイル シートをインポートします
CSS の @import ステートメントを使用して、外部スタイル シート (CSS ファイル) を他の 2 つの CSS にインポートできますファイル、およびインポートされた CSS
@import ステートメントを使用して、Web ページの タグに CSS ファイルをインポートすることもできます。インポートされた CSS ファイル内の
スタイル ルール定義ステートメントは
3. スタイルルールのセレクター
HTMLセレクター: htmlタグ
クラスセレクター:
HTMLタグによって作成された各Webページ要素をいくつかのカテゴリに分割するには、このHTMLタグのclass属性を異なる値に設定する必要があります
段落 1
段落 1 p>
スタイル シートでは、HTML タグのカテゴリごとにスタイル ルールを定義できます
スタイル シートでは、カテゴリのすべての HTML タグのスタイル ルールを定義できます。
< style>
.blueone(color:blue)
青色の段落
スタイルシートでは、id 値 yellowone を持つ HTML 要素のスタイルルール定義ステートメントは次のとおりです。
P EM{背景: 黄色}: EM{背景: 緑}
の後ろに次のスタイル ルールが定義されている場合でも、セレクターは、単一のセレクターで定義されたスタイル ルールよりも優先されます。段落タグ
は引き続き黄色の背景を使用します
セレクターの結合
スタイル シートでの繰り返しの宣言を減らすために、1 つのスタイル ルール定義ステートメントで複数のセレクターを結合し、カンマ (,) で区切って使用できます
疑似要素セレクター
疑似要素セレクターは、同じ HTML 要素のさまざまな状態と状態を参照します。それに含まれる内容の一部を定義する方法。
たとえば、ハイパーリンク タグ の通常の状態、訪問された状態、選択された状態、カーソルがハイパーリンク テキストに移動したときの状態、
段落の最初の文字と最初の行については、次のことができます。疑似要素セレクターを使用して定義します。疑似要素をセレクター スタイル定義として使用します:
html: 疑似要素 {属性: 値}
一般的に使用される疑似要素:
A: ハイパーリンクの選択時にアクティブになります
A:link ハイパーリンクの通常の状態 (アクションの前)
P:first-line 段落のテキストの最初の行
P:first-letter 段落の最初の文字
クラスセレクターと疑似要素で使用される形式:
4. スタイルルールに関するコメント
CSS には多くのスタイル属性があり、大きく次のカテゴリに分類できます カテゴリ:
フォント、背景、テキスト、位置、レイアウト、エッジ、リスト、その他
5. スタイル属性の詳細説明
フィルター(cssフィルター)