一、元素选择器

1.最常见的选择器就是元素选择器，文档的元素就是最基本的选择器

例如：h2{} a{} ……

<p>HelloWorld</p>p{color:blue;}


二、选择器分组

1.例子：

h2、h3{}

h2,h3{color:red;}


2.通配符：

*{}

<!DOCTYPEhtml><htmllang="en"><head><metacharset="UTF-8"><title>选择器</title><linkhref="style.css"rel="stylesheet"type="text/css"></head><body><h2>标题1</h2><h3>标题2</h3><p>HelloWorld</p></body></html>

*{color:red;}h2,h3{font-size:45px;}

通常会使用通配符来取消内外边距

*{margin:0px;padding:0px;}


三、类选择器

1.类选择器允许以一种独立于文档元素的方式来指定样式

例如：.class{}

.div{color:red;}

2.结合元素选择器

例如：a.class{}

a.div{color:red;}<!DOCTYPEhtml><htmllang="en"><head><metacharset="UTF-8"><title>选择器</title><linkhref="style.css"rel="stylesheet"type="text/css"></head><body><divclass="div">HelloWorld</div><aclass="div">HelloWorld</a></body></html>

3.多类选择器

例如：.class.class{}

.p1{color:blue;}.p2{font-size:30px;}.p1.p2{font-style:italic;}

<!DOCTYPEhtml><htmllang="en"><head><metacharset="UTF-8"><title>选择器</title><linkhref="style.css"rel="stylesheet"type="text/css"></head><body><pclass="p1">Thisismywebpage</p><pclass="p2">Thisismywebpage</p><pclass="p1p2">Thisismywebpage</p></body></html>