常用的选择器
CSS选择器作用：就是指定CSS要作用的标签，那个标签的名称就是选择器。意为：选择哪个容器。
分类：基本选择器和扩展选择器。
基本选择器：
- 标签选择器：针对一类标签
- ID选择器：针对某一特定的标签使用
- 类选择器：针对i想要的所有标签使用
- 通用选择器（通配符）：针对所有的标签都实用（不建议使用）
下面就是详解代码：
1标签选择器
就是针对这个页面上的所有这类的标签。
<html>
<head>
<meta charset="UTF-8">
<title>标签选择器</title>
<style type="text/css">
p{
font-size: 50px;
color: aquamarine;
}
</style>
</head>
<body>
<p>这个是前端开发中的标签选择器</p>
</body>
</html>
2ID选择器：规定用#来定义
针对某一个特定的标签来使用，只能使用一次。css中的ID选择器以”#”来定义。
<html>
<head>
<meta charset="UTF-8">
<title>ID选择器</title>
<style type="text/css">
#id{
font-size: 50px;
color: green;
}
</style>
</head>
<body>
<p id="id">这是ID选择器</p>
</body>
</html>
ID选择器的命名规则：
（1）只能有字母、数字、下划线。
（2）必须以字母开头。
（3）不能和标签同名。比如id不能叫做body、img、a。
（4）大小写严格区分，也就是说aa,和AA是两个不同的ID
另外，特别强调的是：HTML页面，不能出现相同的id，哪怕他们不是一个类型。比如页面上有一个id为pp的p，一个id为pp的div，是非法的！
3类选择器：规定用圆点.来定义
和id非常相似，任何的标签都可以携带id属性和class属性。但是id属性只能被某一特定标签引用一次
class属性的特点：
特性1：类选择器可以被多种标签使用。
特性2：同一个标签可以使用多个类选择器。用空格隔开。举例如下
<h3 class="class1 class2">我是一个h3</h3>
应该注意：
（1）不要去试图用一个类名，把某个标签的所有样式写完。这个标签要多携带几个类，共同完成这个标签的样式。
（2）每一个类要尽可能小，有“公共”的概念，能够让更多的标签使用。
如：
<html>
<head>
<meta charset="UTF-8">
<title>类选择器</title>
<style type="text/css">
.class1{color: chartreuse;}
.class2{font-size: 30px;}
.name1{color: gold;font-size: 30px;}
.name2{border: double;}
</style>
</head>
<body>
<p class="name1 name2">我是一个p</p>
<h1 class="class1 class2">我是一个h2</h1>
</body>
</html>
4通配符选择器
将匹配任何标签。不建议使用，IE有些版本不支持，大网站增加客户端负担。
效率不高，如果页面上的标签越多，效率越低，所以页面上不能出现这个选择器。
举例：
<style type="text/css">
*/*定义通用选择器*，希望所有标签的上边距和左边距都为0*/{
margin-left:0px;
margin-top:0px;
}
</style>
扫一扫
224
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
