css常用选择器、否定伪类

最新推荐文章于 2023-03-28 23:15:23 发布

夏目松松

最新推荐文章于 2023-03-28 23:15:23 发布

阅读量681

点赞数

文章标签： html javascript css

本文链接：https://blog.csdn.net/qq_43129582/article/details/105541767

版权

常用选择器：
1：元素选择器：通过元素选择器可以选择页面中的所有指定元素
语法：标签名{}
2：id选择器：通过元素的id属性值选中唯一的一个元素(id名不可重复)
语法：#id属性值{}
3：（类）class选择器：通过元素的class属性值选中一组属性
语法：.class属性值{}
特点：拥有相同class属性值的元素，为一组元素
可以同时为一个元素设置多个class属性值，多个值之间使用空格隔开
4：选择器分组：通过选择器分组可以同时选中多个选择器对应的元素
语法：选择器1,选择器2,选择器N{}
5：通配选择器：可以用来选中页面中的所有元素
语法：*{}
6：复合选择器（交集选择器）：可以选中同时满足多个选择器的元素
(都要满足) 语法：选择器1选择器2选择器N{}
（多实用于class选择器）

<!datetime>
<html>
<head>
<meta charset="utf-8">
<title>常用选择器</title>
<style>

 **元素选择器** 
p{color:yellow;}

 **id选择器**
#p1{color:red;}

 **class选择器** 
.p2{color:red;}

.p3{font-size:50px;}


 **选择器分组：**
 #p1,.p2,h1{clolor:black;}

 
**通配选择器：**
*{font-size:60px;}

 **复合选择器（交集选择器）**

 
</style>

</head>


<body>
<h>呵呵</h>
<p>锄禾日当午</p>
<p id="p1">锄禾日当午</p>
<p class="p2 p3">锄禾日当午</p>
<p class="p2">锄禾日当午</p>
<p class="p2">锄禾日当午</p>



</body>

</html>

否定伪类
作用：可以从已选中的元素中删除某些元素
语法：：not(选择器)

例如：为所有的p元素设置一个背景颜色，除了class值为hello的元素 p:not(.hello){}

夏目松松

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
css常用选择器、否定伪类

常用选择器：1：元素选择器：通过元素选择器可以选择页面中的所有指定元素语法：标签名{} 2：id选择器：通过元素的id属性值选中唯一的一个元素(id名不可重复)语法：#id属性值{} 3：（类）class选择器：通过元素的class属性值选中一组属性语法：.class属性值{} 特点：拥有相同class属性值的元素，为一组元素可以同时为一个元素设置多个class属性值，多个值之...
复制链接

扫一扫