⾏内样式:在标签中添加style属性,⽤style = '样式名:取值' 的⽅式添加
/*选择带有id属性的a标签*/
a[id]{
color: red
}
/*属性选择器前⾯的选择器可以是任意⼀种,如类别选择器*/
.class_a[name]{
/*选择class属性为class_a的标签中,带有name属性的标签*/
color:blue;
}
/*可以规定某⼀属性的取值(精确匹配)*/
.class_a[name = 'first']{
color:blue;
}
/*可以规定某⼀属性⾄少含有某个值(⾮精确匹配*/
.class_a[name ~= 'second']{
color:blue;
}
/*可以规定某⼀属性值的取值带有某⼀部分*/
.class_a[name ^= 'myname']{
/*name属性的值以myname开头,如name = 'myname_1'*/
}
.class_a[name $= 'one']{
/
*name属性的值以myname结尾,如name = 'name_one'*/
}
.class_a[name *= 'name']{
/*name属性的值包含name这个⼦串,即上⾯的两个例⼦都可以选中*/
}
7. 组合选择器
组合选择器(A B):选择位于元素A内部的元素B
直接⼦元素B
⼦元素选择器(A>B):选择元素A的直接
第⼀个B元素,⼆者必须有同⼀个⽗元素,否则⽆效相邻兄弟选择器(A+B):选择A元素后⾯的第⼀个
普通选择器(A~B):选择A元素后的所有B元素,这些B元素必须和A有同⼀个⽗元素
并列选择器(A,B):同时选中A和B,设置相同的样式
8. 否定选择器
/*class属性不为class_a的标签字体设为蓝⾊*/
:not(.class_a){
color:blue;
}
9. 通⽤选择器
所有元素都适⽤
对所有元素
/*将所有元素的margin和padding设为0*/
*{
margin:0;
padding:0;cssclass属性
}
选择器的权重:
Youky:前端知识总结(三)CSS巩固篇:各类元素的各种样式z huanlan.zhihu Youky:前端知识总结(四)CSS杂谈篇:⼀点细节问题z huanlan.zhihu
版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198,我们将在24小时内删除。
发表评论