HTML学习之路-第八天
1.CSS-并集选择器
(1)作用:给所有选择器选中的标签设置属性
(2)格式:
选择器1,选择器2{
属性:值;
}
(3)注意点:选择器之间用“,”来连接,并集选择器是为了简化代码
2.CSS-兄弟选择器
(1)相邻兄弟选择器:给指定选择器后面紧跟的那个选择器选中的标签设置属性
格式:
选择器1+选择器2{
属性:值;
}
注意点:必须通过“+”连接,不能选中被隔开的选择器
(2)通用兄弟选择器:给指定选择器后面的所有选择器选中的标签设置属性
格式:
选择器1~选择器2{
属性:值;
}
3.CSS-序选择器
(1)格式:
标签:序选择器{
属性:值;
}
(2)同级别的::first-child(同级别的第一个标签,不区别类型)
:last-child(同级别的最后一个标签,不区别类型)
:nth-child(n)(同级别中第n个标签,不区别类型)
:nth-last-child(n)(同级别中倒数第n个标签,不区别类型)
:only-child(选中父元素中唯一的标签)
:nth-child(odd)(同级别中所有奇数标签)
:nth-child(even)(同级别中所有偶数标签)
(3)同类型的::first-of-type(同级别中同类型的第一个标签)
:last-of-type(同级别中同类型的最后一个标签)
:nth-of-type(n)(同级别中同类型的第n个标签)
:nth-last-of-type(n)(同级别中同类型的倒数第n个标签)
:only-of-type(选中父元素中唯一类型的标签)
:nth-of-type(odd)(同类型中所有奇数标签)
:nth-of-type(even)(同类型中所有偶数标签)
(4)其他详细的序选择器可参考此链接
4.CSS-属性选择器
(1)作用:根据指定的属性名称找到对应的标签,然后设置属性
(2)格式:
标签[attribute]{
属性:值;
}
作用:根据指定的属性名称找到对应的标签,然后设置属性
标签[attribute=value]{
属性:值;
}
作用:根据指定的属性名称及其值等于value,找到对应的标签,然后设置属性
属性的取值以某某开头的:
标签[attribute|=value]{
属性:值;
}
标签[attribute^=value]{
属性:值;
}
属性的取值以某某结尾的:
标签[attribute$=value]{
属性:值;
}
属性的取值是否包含某个特定的值:
标签[attribute~=value]{
属性:值;
}
标签[attribute*=value]{
属性:值;
}
5.CSS-通配符选择器
(1)作用:给当前界面所有的标签设置属性
(2)格式:
*{
属性:值;
}
(3)注意点:当前界面标签很多时,性能会比较差