ホームページ >ウェブフロントエンド >CSSチュートリアル >CSS セレクターの説明_基本チュートリアル

CSS セレクターの説明_基本チュートリアル

WBOY
WBOYオリジナル
2016-05-16 12:08:111664ブラウズ

1. タイプセレクター
body
{
font-size:12px;
}

{
color:blue;
}
Web を参照しますpage 上に示すように、タグ内の既存のタグ タイプが名前のセレクターとして使用されます: body タグ内のすべてのテキストのサイズは 12 ピクセル、段落内のテキストの色は青です。
2. グループ セレクター
h4,p,span
{
font-size:12px;
}
h4、p、span タグ内のすべてのテキストが、ページのサイズは 12 ピクセルです。つまり、オブジェクトのグループに同じスタイルを指定し、各タグの間をカンマで区切ります。
3. セレクターを含めます
div p
{
font-weight:bold;
}
これは、div タグ内の p タグ内のテキストが太字であることを意味します。 is 包含関係。各タグはスペースで区切られ、複数レベルの包含が可能です。
IV. id およびクラス セレクター
id は、ページ内の唯一の要素のスタイル定義です。このスタイルはページ内で 1 回のみ使用されます。つまり、id は繰り返されません。

..

#myDiv
{
font-size:12px;
}
クラスは、共通または頻繁に使用されるスタイルを定義します。スタイル ページ上で複数回表示する必要がある場合は、以下に示すように、異なるタグに同じクラスを指定できます。 div タグと p タグのフォントはすべて青色です。
div>

..


.red
{
color:blue;
}
5. 組み合わせセレクター
ID またはクラスを使用し、タグも使用して結合します。
h1 #cont
{
}
h1 タグを id cont で表します。
h1 .cont
{
}
クラス cont を持つすべての h1 タグを示します
6. 疑似クラスセレクタ
よく使用されるタグ
a:link
{
}
a:hover
{
}
a:visited
{
}
7. ワイルドカードセレクター
*
{
color:blue;
}
すべてのオブジェクトを表すフォントは青です。
声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。