CSS 的 类class选择器 的正确写法

1.

正确写法：
前面是标签名的通配符，后面是 class的名称。（）

*.a_class {color:red;}

下面的简写，尽量少用

.a_class {color:red;}

2.举例

举例：

p.a_class {}

解释为：“其 class 属性值为 a_class 的所有段落”。

举例2：

*.a_class {}

解释为：“其 class 属性值为 a_class 的所有任意标签”。

3.多层类叠加：

同一个 <p> 标签，同时拥有两个 class属性。

<p class="important warning">This paragraph is a very important warning.</p>

*.important.warning {background:silver;}

解释为：“其 class 属性值同时为 important 且为 warning 的所有任意标签”。

4.延伸

ID选择器的正确写法

*#intro {font-weight:bold;}

选择器分组

h1, h2, h3, h4, h5, h6 {color:blue;}

如果希望选择有某个属性的元素，而不论属性值是什么，可以使用简单属性选择器。
将同时有 href 和 title 属性的 HTML 超链接的文本设置为红色。

a[href][title] {color:red;}

假设我们为描述太阳系行星设计了一个 XML 文档。如果我们想选择有 moons 属性的所有 planet 元素，使之显示为红色，以便能更关注有 moons 的行星，就可以这样写：

planet[moons] {color:red;}

除了选择拥有某些属性的元素，还可以进一步缩小选择范围，只选择有特定属性值的元素。
例如，假设希望将指向 Web 服务器上某个指定文档的超链接变成红色，可以这样写：

a[href="http://www.w3school.com.cn/about_us.asp"] {color: red;}

或者，与简单属性选择器类似，可以把多个属性-值选择器链接在一起来选择一个文档。

a[href="http://www.w3school.com.cn/"][title="W3School"] {color: red;}

5.正好写油猴（TamperMonkey）脚本，所需要的后代选择器

h1 em {color:red;}

（注意和 选择器分组 之间的区别，一个没逗号，一个有逗号。）

主区的背景为白色，
主区的链接为蓝色。

div.maincontent {background:white;}div.maincontent a:link {color:blue;}

6.更远的延伸

子元素选择器
相邻兄弟选择器