个人关于CSS优先级的一些想法

我们都知道CSS有三大特性:

一、继承

所谓继承就是:当标签之间属于一种嵌套关系时,子元素可以继承父元素的样式

像text-,font-,line-这些元素开头的属性、以及color等文字相关的属性都可以继承

但是也有特殊性哦:

1. a标签的颜色不能继承,必须对a标签本身进行设置

2. h标签的字体大小不能修改,必须对h标签本身进行修改

3. div 标签的高度如果不设置由内容来决定(没有内容高度为0),宽度默认由父元素继承过来

二、层叠

层叠就是浏览器处理冲突的一种机制:浏览器的渲染机制是从上到下,当出现冲突时会采用最后的那个样式,即样式的覆盖。

注意点:层叠性只有在多个选择器中选中“同一个标签”,然后又设置了“相同的属性”,才会发生层叠性

三、优先级

也是我今天在开发中遇到的想跟大家分享的东西了

CSS的优先级如下:

!important>行内样式>id选择器>类选择器>标签选择器>通配符>继承>浏览器默认

下面我将一一列举:

!important:(要谨慎使用)

行内样式:

id选择器:

类选择器:

标签选择器:

通配符:

样式优先级如图(这里是在Gloogle Chrome中的开发者工具中截的一个图片):

好啦,到这里就结束了哦有问题欢迎留言,一起探讨,共同进步!

猜你喜欢

转载自blog.csdn.net/life_stranded/article/details/81169407