发表于: 2017-04-16 23:44:30
2 747
今天完成的事情:
看了很多细节方面的东西。
先贴一条css优先级,从上到下为最高和最低。
内联样式 | <p style="...;...;"> ...... </p> |
内部样式表 | <style type="text/css"> ...... </style> |
外部样式表 | <link rel="stylesheet" type="text/css" href=" "/> |
浏览器默认 |
解决冲突:继承与层叠
1.继承:某个属性从父元素传递到子元素的机制
2.继承的意义:不用为每个元素指定的属性,简化了代码,若不需继承属性,覆盖即可
3.什么元素可以继承属性? 除了<html>(根元素)都有,因为只要它无父元素。
层叠:当多个冲突和层叠的CSS声明应用在同一元素时,用来控制应用CSS声明的顺序
1重要性,若声明具有一样的重要性,则计算特殊性
2特殊性,若声明具有一样的特殊性,则考虑源顺序
3源顺序
浏览器内建样式表 | 优先级最低 |
作者样式表中的常规声明 | |
用户样式表中的常规声明 | |
作者样式表中的重要声明 | 重要声明: { ... ; ... !important;} |
用户样式表中的重要声明 | 优先级最高 |
由于 css 是全局的,在被引入的文件和当前文件出现重名的情况下,前者样式就会被后者覆盖。在引入一些公用组件,或者多人协作开发同一页面的时候,就需要考虑样式会不会被覆盖,这很麻烦。
问题:
由于我的模块里有栅格系统,因为浮动导致模块都重叠到一起了,起初以为是优先级的关系,后来才发现是浮动的原因,在container加个overflow:auto就行。特别感谢派大星师兄给我的解答。
收获:
关于任务,用纯css写是完全没有意义的,更重要的是学会对工具对框架的使用,学会组装。 模块化的意义十分重大。
评论