这里CSS选择器主要分为以下这几种:1. 标签选择器 2. class选择器 3. id选择器 4. 复合选择器 5. 通配符选择器 CSS 选择器的主要功能就是选中⻚⾯指定的标签元素. 选中了元素, 才可以设置元素的属性.
1.标签选择器
<style>p{color: red;}
</style>
<body><p>标签选择器</p>
</body>
这里面表示,所有的P标签 设置为红色。
2.class选择器
<style>.one{color: red;}
</style>
<body><div class="one">类选择器</div>
</body>
这里表示选择class为one的元素,颜色改为红色。这里注意上面的需要.类名。
3.id选择器
<style>#one{color: red;}
</style>
<body><div id="one">id选择器</div>
</body>
注意点:
1.所有的标签上都有id属性
2.id属性值类似于身份证号码,在一个页面中是唯一的,不可重复的
3.一个标签上只能有一个id属性值
4.一个id选择器只能选中一个标签
这里表示id为one的元素,颜色改为红色。(id选择器的时候需要#id)
4. 通配符选择器
<style>*{color: red;}
</style>
<body><div>通配符选择器</div>
</body>
这里表示设置页面所有为红色。
5. 复合选择器
ul li a{coler : blue;
}
这里表示ul标签下的 li 标签下的a 标签 ,设置为红色。
1. 以上三个标签选择器ul li a 中的任意,都可以替换成类选择器,或者id选择器,可以是任意选择器的组合,也可以是任意数量选择器的组合。
2. 不一定相邻的标签。
3. 如果需要选择多种标签,可以使用,分割。逗号前后可以是以上任意选择器,也可以是选择器的组合。