1. Home
  2. CSSおよびネストされたグループ化

CSSおよびネストされたグループ化2024 年の最新の入門チュートリアル。このコースでは セレクタのグループ化,例,ネストされたセレクタ,例, について学習できます。

CSSおよびネストされたグループ化

セレクタのグループ化

スタイルシート内の同じスタイルを持っている多くの要素があります。

H1
{
色：緑;
}
H2
{
色：緑;
}
P
{
色：緑;
}

コードを最小限に抑えるには、パケットセレクタを使用することができます。

各セレクタは、カンマを使用します。

次の例では、グループ化セレクタ上記のコードを使用します。

例

h1,h2,p
{
color:green;
}

»をお試しください

ネストされたセレクタ

これは、セレクタセレクタインテリアスタイルに適用される場合があります。

次の例では、3つのスタイルのセット：

  • すべてのp要素のスタイルを指定します
  • = "マーク"の要素は、すべてのクラスのスタイルを指定します
  • =要素内の "マーク" p要素は、すべてのクラスのスタイルを指定します

例

P
{
色：青;
テキスト整列：センター;
}
.marked
{
背景色：赤;
}
.marked P
{
色：白;
}

»をお試しください

ホットチュートリアル

お問い合わせ

CSSおよびネストされたグループ化
10/30