pink老师HTML5+CSS3学习笔记 | DAY18

最新推荐文章于 2024-07-19 15:50:46 发布

头毛很炸

最新推荐文章于 2024-07-19 15:50:46 发布

阅读量134

点赞数 1

文章标签： css html css3

本文链接：https://blog.csdn.net/m0_53454320/article/details/129855390

版权

css3新特性

1、属性选择器

/* 意为选择具有att属性的E元素； */
E[att] {
    ...
}

/*（重点），意为选择具有att属性且属性值为val的E元素；*/
E[att="val"] {
    ...
}

/* 意为选择具有att属性且属性值以val开头的E元素； */
E[att^="val"] {
    ...
}

/* 意为选择具有att属性且属性值以val结尾的E元素； */
E[att$="val"] {
    ...
}

/* 意为选择具有att属性且属性值中含有val的E元素； */
E[att*="val"] {
    ...
}

2、结构伪类选择器

结构伪类选择器主要根据文档结构来选择器元素，常用于根据父级选择里面的子元素；

/* 意为选择父元素中的第一个子元素E； */
E:first-child {
    ...
}

/* 意为选择父元素中最后一个子元素E； */
E:last-child {
    ...
}

/* 意为选择父元素中的第n个子元素E； */
E:nth-child(n) {
    ...
}

E:nth-child(n)中：

n可以是数字——表示第n个子元素；

n可以是关键字——even偶数，odd奇数；

n可以是公式：

公式	说明
n	从0开始，每次加一，忽略第0个和超出部分，表示选择了全部
2n	取偶数
2n+1	取奇数
5n	取5的倍数
n+5	从第五个开始（包含第五个）到最后
-n+5	前五个（包含第五个）