1.标记选择器
标记选择器是指用HTML标记名称作为选择器，按标记名称分类，为页面中某一类标记指定统一的CSS样式。
标记名{属性1:属性值1;属性2:属性值2;属性3:属性值3;}
该语法中，所有的HTML标记名都可以作为标记选择器，如body、h1、p、strong等。用标记选择器定义的样式对页面中该类型的所有标记都生效。标记选择器最大的优点是能快捷为页面中同类型的标记统一样式，同时这也是它的缺点，不能设计差异化样式。
2.类选择器
类选择器使用“,”（英文点号）进行标识，后面紧跟类名。
.类名{属性1:属性值1;属性2:属性值2;属性3:属性值3;}
该语法中，类名即为HTML元素的class属性值，大多数HTML元素都可以定义class属性。类选择器最大的优势是可以为元素对象定义单独或相同的样式。
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>类选择器</title>
<style type="text/css">
.red{color:red;}
.green{color:green;}
.font22{font-size:22px;}
p{
text-decoration:underline;
font-family:"微软雅黑";
}
</style>
</head>
<body>
<h2 class="red">二级标题文本</h2>
<p class="green font22">段落一文本内容</p>
<p class="red font22">段落二文本内容</p>
<p>段落三文本内容</p>
</body>
</html>
注意：类名的第一个字符不能使用数字，并且严格区分大小写，一般采用小写的英文字符。
3.id选择器
id选择器使用“#”进行标识，后面紧跟id名。
#id名{属性1:属性值1;属性2:属性值2;属性3:属性值3;}
该语法中，id名即为HTML元素的id属性值。大多数HTML元素都可以定义id属性，元素的id值是唯一的，只能对应于文档中某一个具体的元素。
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>id选择器</title>
<style type="text/css">
#bold{font-weight:bold;}
#font24{font-size:24px;}
</style>
</head>
<body>
<p id="bold">段落1：id="bold",设置粗体文字。</p>
<p id="font24">段落2：id="font24",设置文号为24px。</p>
<p id="font24">段落3：id="font24",设置文号为24px。</p>
<p id="bold font24">段落3：id="bold font24",同时设置粗体和字号24px。</p>
</body>
</html>
id选择器不支持像类选择器那样定义多个值，类似“id=“bold font24””的写法是完全错误的。
4.通配符选择器
通配符选择器用“*”号表示，它是所有选择器中作用范围最广的，能匹配页面中所有的元素。
*{属性1:属性值1;属性2:属性值2;属性3:属性值3;}
如果要清除所有HTML标记的默认边距，则：
*{
margin:0;
padding:0;
}
5.标签指定式选择器
标签指定式选择器又称交集选择器，又两个选择器构成，其中第一个为标记选择器，第二个为class选择器或id选择器，两个选择器之间不能有空格。
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>标签指定式选择器的应用</title>
<style type="text/css">
p{color:blue;}
.special{color:green;}
p.special{color:red;}
</style>
</head>
<body>
<p>普遍段落文本（蓝色）</p>
<p class="special">指定了.special类的段落文本（红色）</p>
<h3 class="special">指定了.special类的标记文本（绿色）</h3>
</body>
</html>
6.后代选择器
后代选择器用来选择元素或元素组的后代，其写法就是把外层标记写在前面，内层标记写在后面，中间用空格分隔。当标记发生嵌套时，内层标记就成为外层标记的后代。
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>后代选择器</title>
<style type="text/css">
p strong{color:red;}
strong{color:blue;}
</style>
</head>
<body>
<p>段落文本<strong>嵌套在段落中，使用strong标记定义的文本（红色）。</strong></p>
<strong>嵌套之外由strong标记定义的文本（蓝色）。</strong>
</body>
</html>
后代选择器不限于使用两个元素，如果需要加入更多的元素，只需在元素之间加上空格即可。
7.并集选择器
并集选择器是各个选择器通过逗号连接而成的，任何形式的选择器（包括标记选择器、类选择器及id选择器等），都可以作为并集选择器的一部分。如果某些选择器定义的样式完全相同或部分相同，就可以利用并集选择器为它们定义相同的CSS样式。
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>并集选择器</title>
<style type="text/css">
h2,h3,p{color:red;font-size:14px;}
h3,.special,#one{text-decoration:underline;}
</style>
</head>
<body>
<h2>二级标题文本。</h2>
<h3>三级标题文本，加下划线。</h3>
<p class="special">段落文本1，加下划线。</p>
<p>段落文本2，普通文本。</p>
<p id="one">段落文本3，加下划线。</p>
</body>
</html>
