Web基础04 CSS优先级和选择器

CSS优先级
在CSS中 继承的权重为0
子类定义的比父类优先
权重相加判断优先级
标签的权重为1<类的权重为10<id的权重为100
规则
①行内样式优先,远大于100
②权重相同时,CSS遵循就近原则,最后的样式优先级数大
如 header{
color:blue!important;
}
!important放在属性值和分好之间,使优先级最大,复合选择器无论有多少个标签选择器权重也不会大于类选择器,复合选择器无论有多少个标签选择器和类选择器权重也不会大于id选择器

1、属性选择器 根据标签的属性及属性值来选择
例如 E[id=“header”]{font-size:80px;}
E是标签 header是属性选择器 font-size是声明
E[att^=value] att中以value开头的
E[att$=value] att中以value结尾的
E[att*=value] att中包含value的
2、关系选择器
子代选择器 h1>strong 选择嵌套在h1的标签strong
临近兄弟选择器 h2+p 选择h2后背临的一个兄弟标签p
普通元素选择器 p~h2 选择p标签所有的h2兄弟标签

3、结构化伪类选择器
可减少class与id定义
:root
:not 例如body *:not(h2) 选择body中排出h2的标签
:only-child li:only-child 选某问标签仅有唯一字标签的类
:first-child 选择父元素第一个子标签
:last-child 选择父元素最后一个子标签
:nth-child(n) 选择父元素第n子标签
:nth-last-child(n) 选择父元素倒数第n个子标签
:nth-of-type(n) 例如h2:nth-of-type(dd) 选择奇数行的h2
:nth-last-of-type(n) 倒数第N个type
:empty 选择没有标签或文本的所有标签

4、伪元素选择器
E:before{content:文字/url();}
:before 例如p:before 在p之前插入内容
:after 例如p:after 在p之后插入内容

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值