css为什么叫层叠样式表
2017-05-09 21:33
141 查看
------------------------------------------------------------------------------------
层叠就是浏览器对多个样式来源进行叠加,最终确定结果的过程.
css之所以有“层叠”的概念,是因为有多个样式来源。
其中css样式来源有5个,分别是内联样式(<a style="">),内部样式(<style></style>),
外部样式(写在css文件中的样式),浏览器用户自定义样式,浏览器默认样式;
按照其来源优先级为内联样式>内部样式>外部样式>浏览器用户自定义样式>浏览器默认样式
按照选择器优先级为id >class>元素选择器
如果有important,important优先级最高。
------------------------------------------------------------------------------------
层叠指的是样式的优先级,当产生冲突时以优先级高的为准。
1. 开发者样式>读者样式>浏览器样式(除非使用!important标记 )
2. id选择符>(伪)类选择符>元素选择符
3. 权重相同时取后面定义的样式
以下是一段经典的html,三个类名分别为模块、标题和正文。
<div class="mod">
<div class="hd"></div>
<div class="bd"></div>
</div>
大部分html页面都可以由这种结构嵌套或者累加而成。
------------------------------------------------------------------------------------
个人理解:
先理解层的概念,一般我们认为一个DIV就是一层,多个DIV嵌套,就算是层叠,如下所示:
每一层都有一个class属性,即每层都会定义一个样式,综合起来,叫层叠样式表,这也是为什么现在流行的是DIV+CSS的样式更改,而抛弃table标签的含义。
层叠就是浏览器对多个样式来源进行叠加,最终确定结果的过程.
css之所以有“层叠”的概念,是因为有多个样式来源。
其中css样式来源有5个,分别是内联样式(<a style="">),内部样式(<style></style>),
外部样式(写在css文件中的样式),浏览器用户自定义样式,浏览器默认样式;
按照其来源优先级为内联样式>内部样式>外部样式>浏览器用户自定义样式>浏览器默认样式
按照选择器优先级为id >class>元素选择器
如果有important,important优先级最高。
------------------------------------------------------------------------------------
层叠指的是样式的优先级,当产生冲突时以优先级高的为准。
1. 开发者样式>读者样式>浏览器样式(除非使用!important标记 )
2. id选择符>(伪)类选择符>元素选择符
3. 权重相同时取后面定义的样式
以下是一段经典的html,三个类名分别为模块、标题和正文。
<div class="mod">
<div class="hd"></div>
<div class="bd"></div>
</div>
大部分html页面都可以由这种结构嵌套或者累加而成。
------------------------------------------------------------------------------------
个人理解:
先理解层的概念,一般我们认为一个DIV就是一层,多个DIV嵌套,就算是层叠,如下所示:
<div class="mod">第一层 <div class="hd">第二层</div> <div class="bd">第二层 <div class="bd2"></div>第三层 </div> </div>
每一层都有一个class属性,即每层都会定义一个样式,综合起来,叫层叠样式表,这也是为什么现在流行的是DIV+CSS的样式更改,而抛弃table标签的含义。
相关文章推荐
- web前端优化时为什么不建议使用css @import
- 为什么要初始化 CSS 样式
- 为什么css中添加了display:none其它js代码会失效?
- CSS:<ul>的左边为什么有40px的默认距离呢?
- 层叠样式表(CSS)
- css 层叠样式表(一)
- ASP.NET动态网站开发培训-36.互动论坛制作(四、使用层叠样式表(CSS)美化界面)
- 为什么要初始化CSS?
- BS开发入门——CSS(层叠样式表)名称含义
- 大流量网站,CSS为什么直接写在页面里?
- CSS(层叠样式表)
- 在网页中引用js文件、css文件或图片文件时为什么要加上问号+值或key-value
- 深入理解CSS系列(二):为什么height:100%不生效?
- css中为什么需要浮动?
- 为什么尽量避免使用 CSS 表达式
- 为什么要在引入的css或者js文件后面加参数
- 01 div+css 为什么需要div+css布局
- [CSS]为什么不推荐在CSS中使用ID选择器
- 2014年10月13日 层叠样式表CSS
- CSS 层叠样式表基础总结