【面试题集 |
您所在的位置：网站首页 › css默认样式的优先级是多少位的文件 › 【面试题集 |
|
文章目录
一. CSS权重二. 优先级分类三. 优先规则四. 实例解析4.1 实例一4.2 实例二
一. CSS权重
CSS权重指的是样式的优先级，当同一个元素出现样式冲突时，会比较选择器之间的权重来决定谁生效。具体的选择器权重如下： 二. 优先级分类 优先级选择器 / 样式权重值备注一级!important10000无条件优先的属性，会覆盖页面内其他任何位置定义的元素样式，慎用二级行内样式（ style=” ” ）1000会造成css难以管理，不推荐使用三级id选择器100#content四级类选择器、伪类选择器、属性选择器10比如： .content、:hover、:first-child五级标签选择器、伪元素选择器1比如：div、p、:before六级其他选择器0* 空格 + > ~ 三. 优先规则有两条或多条样式作用于同一个元素时，权重高的那条样式对元素起作用；权重相同的，则根据就近原则的样式优先，就近原则也相同时，则后定义的样式优先。 就近原则的优先级是： 行内式 —— 标签内的style属性；内嵌式 —— 标签内的标签；外链式 —— 标签引入的外部css样式文件；导入式 —— @import导入引入的外部css样式文件； 四. 实例解析CSS样式优先级之间的权重比较采用的是求和比大小的模式。 所以来看两个典型的实例： 4.1 实例一 div{ color:red !important; } ... 我是一行严肃的占位文字内嵌式的权重值为10000+1，下面的行内式的权重值为1000，所以文字的最终颜色为red。 4.2 实例二 #content div.content_left p{ color:red; } #content .content_left p{ color:blue; } ...... 我是一行严肃的占位文字第一条样式的权重计算：100+1+10+1，结果为112； 第二条样式的权重计算：100+10+1，结果为111。 所以段落p的最终颜色为red。 |
今日新闻 |
推荐新闻 |
| CopyRight 2018-2019 办公设备维修网 版权所有 豫ICP备15022753号-3 |