后代选择器（descendant selector）又称为包含选择器
在后代选择器中，规则左边的选择器一端包括两个或多个用空格分隔的选择器。选择器之间的空格是一种结合符
通常写法为：标签名 标签名{样式....} 如下
<style>
h1 em{color:red;}
</style>
<body>
<h1>This is a<em> important </em> heading </h1>
</body>
运行结果
有关后代选择器有一个易被忽视的方面，即两个元素之间的层次间隔可以是无限的
如
<style> ul em{color: green;} </style> <body> <ul> <li>coffee</li> <li><em>tea</em></li> <li>milk</li> </ul> </body>
结果：
分组选择器写法与后代选择器非常类似
通常写法为：标签名,标签名{样式....} 如下
<style> h2,h3,h4{ text-align: left; color: green; } </style> <body> <h2>Hello World!</h2> <h3>Hello World!</h3> <h4>Hello World!</h4> </body>
结果
将选择器(元素标签)放在规则左边，然后用逗号分隔，就定义了一个规则。其右边的样式将应用到这三个选择器所引用的元素。逗号告诉浏览器，规则中包含三个不同的选择器。如果没有这个逗号，那么规则的含义将完全不同，就会变成后代选择器了。
多类选择器的写法与后代选择器也十分相似，容易混淆
通常写法为：类名 类名{样式....} 如下
<style> .important {font-weight:bold;} .warning {font-style:italic;} .important.warning {background:silver;} </style> <body> <p class="important">This paragraph is very important.</p> <p class="warning">This is a warning.</p> <p class="important urgent warning">This paragraph is a very important warning.</p> </body>
多类选择具有类似叠加样式的作用，当类选择器1类选择器2都定义了样式，则多类选择器：类选择器1 类选择器2{样式...}会将之前已定义的样式加入多类选择器中
通过把两个类选择器链接在一起，仅可以选择同时包含这些类名的元素（类名的顺序不限）。如果一个多类选择器包含类名列表中没有的一个类名，匹配就会失败
因此background:silver;不会给前面两个p标签添加样式