CSS选择器是指在选择要样式化的HTML元素时,用于匹配特定条件的方式。在CSS中,有多种选择器可以使用,下面我们来看看其中10种常见的CSS选择器举例。
1. ID选择器(#): 用于选择具有特定ID的元素。例如:#header {color: red;} 2. 类选择器(.): 用于选择具有特定类名的元素。例如:.menu {font-size: 14px;} 3. 后代选择器(空格): 用于选择特定元素的后代元素。例如:p span {color: blue;} 4. 相邻兄弟选择器(+): 用于选择一个元素的第一个相邻兄弟元素。例如:h2 + p {font-weight: bold;} 5. 属性选择器([]): 用于选择具有特定属性的元素。例如:input[type="text"] {background-color: #eee;} 6. 通配符选择器(*): 用于选择任何元素。例如:* {margin: 0;} 7. 子元素选择器(>): 用于选择特定元素的直接子元素。例如:ul >li {list-style-type: square;} 8. 伪类选择器(:): 用于选择元素的特定状态。例如:a:hover {color: orange;} 9. 伪元素选择器(::): 用于选择元素的特定部分。例如:p::first-letter {font-size: 2em;} 10. 结构性伪类选择器(:nth-child): 用于在给定位置上选择元素。例如:li:nth-child(2) {background-color: #ccc;}
以上是10种常见的CSS选择器举例,它们能够帮助你更方便地选择HTML元素以便样式化和布局。当然,这只是众多选择器中的一部分,若想深入了解,需要进一步学习和实践。