CSS ユニバーサルおよびグループ化セレクター (10)_html/css_WEB-ITnose

1. ユニバーサル セレクター

ユニバーサル セレクターは、すべてのセレクターの中で最も強力かもしれませんが、最も使用されていません。ユニバーサル セレクターはワイルドカードのように機能し、使用可能なすべての要素と一致します。ユニバーサル セレクターはアスタリスクで表されます。ユニバーサル セレクターは通常、ページ上のすべての要素にスタイルを適用するために使用されます

たとえば、次のルールを使用して要素上のデフォルトの空白の境界線を削除できます

*{margin:0;padding:0;}

2. グループ セレクター

グループ セレクターはセレクターの種類ではなく、セレクターの使用方法です。複数のオブジェクトが同じスタイルを定義する場合、それらを 1 つのグループにグループ化すると、コードが簡素化されます。

/*定义所有级别的标题和段落行高为22px*/h1,h2,h3,h4,h5,h6,p{    line-height:22px;}

グループ セレクター。カンマを使用して、同じグループ内の異なるオブジェクトを区切ることができます。グループ セレクターは、異なる要素またはオブジェクトに対して同じスタイルを定義できるという点でクラス セレクターに似ています。

次のスタイルを

.class1{    font-size:13px;    color:red;    text-decoration:underline;    }.class2{    font-size:13px;    color:blue;    text-decoration:underline;    }

に変更します。

グループ化セレクターは

.class1{    color:red;    }.class2{    color:blue;    }    /*共同样式*/.class1,class2{    font-size:13px;    text-decoration:underline;    }

を使用します

グループ化セレクターは、次の 2 つの原則に従います

利便性の原則。グループ化のためのグループ化はできません。各要素やオブジェクトから同じ宣言を抽出して 1 つのグループにまとめても、問題が発生するだけです。このとき、クラス

近接原理を定義すると便利です。複数の要素が隣接しており、同じモジュール内にある場合は、同じ宣言を抽出してグループ化することを検討できます。理由はグループ化しやすく、保守しやすく、理解しやすいです