CSS3学习笔记-选择器

发布时间 2023-11-12 10:22:17作者: 乌清远wqy

在CSS中,选择器是一种指定一个或多个元素的方法。可以根据元素的类型、类、ID、属性等特征来选择元素。CSS3引入了很多新的选择 器,让我们可以更加灵活和精准地选择元素。

下面介绍一些常用的CSS3选择器:

1. 元素选择器

元素选择器指定元素的标签名称,例如 ph1ul

p {
    color: blue;
}

2. 类选择器

类选择器使用.符号指定一个或多个元素的类名。可以为多个元素添加相同的类名,然后使用类选择器为它们设置样式。

.btn {
    background-color: red;
    color: white;
}

3. ID选择器

ID选择器使用#符号指定一个唯一的元素ID。在一个网页中,每个ID只能出现一次。

#header {
    font-size: 24px;
}

4. 子元素选择器

子元素选择器使用>符号指定父元素和子元素之间的关系。例如,选择一个父元素下的所有p元素:

div > p {
    color: red;
}

5. 相邻兄弟选择器

相邻兄弟选择器使用+符号指定相邻的两个元素之间的关系。例如,选择紧接在一个h1元素后面的第一个p元素:

h1 + p {
    font-size: 18px;
}

6. 通用选择器

通用选择器使用*符号指定网页中所有元素。可以结合其他选择器使用,例如:

* {
   margin: 0;
   padding: 0;
}

以上就是一些常见的CSS3选择器。

学习好选择器可以帮助我们精确地控制网页的样式和布局。