一、前端基础-css-css的选择器
原创
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<!-- CSS选择器
1、选择器指明了样式的作用对象，也就是样式作用域那些对象。
2、基础选择器
1、通用选择器：*，匹配所有标签，所有标签样式都收影响。
2、标签选择器：根据标签选择，指定标签受影响。
3、id选择器：根据标签id属性选择，指定id样式受影响，其他id不变。
4、class选择器：根据标签class属性选择，指定class样式受影响，其他class不变。
3、组合选择器
1、多元素选择器：匹配元素A或元素B，A和B之前用逗号分隔。
2、后代元素选择器：匹配所有属于A元素后代的B元素，A和B用空格分隔。
3、子元素选择器：匹配是所有A元素的子元素B，使用大于号。
4、毗邻元素选择器：匹配所有紧邻A元素之后的同级元素B，使用加号。
4、属性选择器
1、attribute：用于选取带有指定属性的元素，与属性的值没有关系。
2、attribute=value：用于选取带有指定属性和值的元素。
3、attribute~=value：用于选取属性值中包含指定词汇的元素。
4、attribute|=value：用于选取带有以指定值开头的属性值的元素，该值必须是整个单词。
5、attribute^=value：匹配属性值以指定值开头的每个元素。
6、attribute$=value：匹配属性值以指定值结尾的每个元素。
7、attribute*=value：匹配属性值中包含指定值的每个元素。
8、可以使用内置属性（id class等）也可以使用自定义的属性
5、伪类
用于向某些选择器添加特殊的效果
1、a:link：未访问的链接。
2、a:visited：已访问的链接。
3、a:hover：悬浮（鼠标移动到链接上）。
4、a:active：选定的链接。
注：1、在 CSS 定义中，a:hover 必须被置于 a:link 和 a:visited 之后，才是有效的。
2、在 CSS 定义中，a:active 必须被置于 a:hover 之后，才是有效的。
3、伪类名称对大小写不敏感。
5、before：在标签内容前添加内容，也可以设置颜色等。
6、after：在标签内容后添加内容，也可以设置颜色等。
-->
</body>
</html>原创声明：本文系作者授权腾讯云开发者社区发表，未经许可，不得转载。
如有侵权，请联系 cloudcommunity@tencent.com 删除。
原创声明：本文系作者授权腾讯云开发者社区发表，未经许可，不得转载。
如有侵权，请联系 cloudcommunity@tencent.com 删除。
评论
登录后参与评论
推荐阅读
腾讯云开发者
