CSS选择器笔记

textboy

于 2015-06-10 18:21:21 发布

阅读量605

点赞数

CC 4.0 BY-SA版权

分类专栏：前端文章标签： CSS

本文链接：https://blog.youkuaiyun.com/textboy/article/details/46445237

12 篇文章

订阅专栏

本文详细介绍了CSS选择器的基础知识，包括标签、ID、类等基本概念，并阐述了CSS选择器之间的并列关系、分组、属性、后代、子元素等高级选择器的应用方法。同时，提供了丰富的示例，帮助开发者更熟练地使用CSS选择器进行网页布局和样式控制。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

基本：标签	(无)，e.g. div
基本：ID	#, e.g. #id_1
基本：class	.，e.g. .class_1
同一标签并列关系	无任何分隔符，e.g. div.c (<div class="c">)
CSS 选择器分组	,
CSS 属性选择器	[]
CSS 后代选择器	（后代包括子、孙、曾孙...）空格，e.g. h1 em (<h1>This is a <em>important</em> heading</h1>)
CSS 子元素选择器	（只是子）>, e.g. h1 > strong (<h1>This is <strong>very</strong> <strong>very</strong> important.</h1>)
[attribute]	用于选取带有指定属性的元素。
[attribute=value]	用于选取带有指定属性和值的元素。E.g.a[target=_blank]
[attribute~=value]	用于选取属性值中包含指定词汇的元素。
[attribute\|=value]	用于选取带有以指定值开头的属性值的元素，该值必须是整个单词。
[attribute^=value]	匹配属性值以指定值开头的每个元素。
[attribute$=value]	匹配属性值以指定值结尾的每个元素。
[attribute*=value]	匹配属性值中包含指定值的每个元素。