CSS セレクタのグループ| CSS:スタイルシート 関数 要素 使い方・書き方 例 CSS サンプル

セレクタのグループ CSS プロパティとは

トピック:同じスタイルの複数の要素をスタイルするには、各要素名をカンマ(,)で区切る

element,element Selector

実例 コード 1

サンプル コードを試す
  • h1 {
  • font-size: 36px;
  • font-weight: normal;
  • }
  • h2 {
  • font-size: 28px;
  • font-weight: normal;
  • }
  • h3 {
  • font-size: 22px;
  • font-weight: normal;
  • }
    情報:
  • スタイルシート内のいくつかのセレクタは同じスタイルルール宣言を共有することができる コンマ区切り(,)のリストをグループ化して、スタイルシートのコードを最小限に抑えることができる 同じスタイルのルールを何度も何度も繰り返すことを 防ぐ ことができる

実例 コード 2

サンプル コードを試す
  • h1, h2, h3 {
  • font-weight: normal;
  • }
  • h1 {
  • font-size: 36px;
  • }
  • h2 {
  • font-size: 28px;
  • }
  • h3 {
  • font-size: 22px;
  • }
    トピック:
  • 上記の例でわかるように同じスタイルルールはfont-weight: normal;セレクタによって共有されているh1h2h3。したがって、上記のコードようにコンマ区切りのリストにグループ化できる

構文

element, element { css : properties ; }
 HTML要素名 {スタイル要素のプロパティ : プロパティ値; }
CSS バージョンCSS 1

サポートするブラウザ対応・互換性

SelectorChromeEdgeFirefoxSafariOpera
element,elementフルサポート◯ サポートフルサポート◯ サポートフルサポート◯ サポートフルサポート◯ サポートフルサポート◯ サポート
CSS セレクタのグループ| CSS:スタイルシート 関数 要素 使い方・書き方 例 CSS サンプル
CSS セレクタのグループ | CSS プロパティ 値| 意味 使い方 実例 – WebRef
あわせて読みたい

Html

Glossary

PHP

JavaScript

JQuery

CSS