(3)避免使用
这部分因为它们可能仅支持某个浏览器,比如倒影,则需要避免使用。
综上所述,css能够用来提高性能的方法还是蛮多的,但我们很容易忽略它们,因为它们所带来的影响似乎没有那么明显,而且,很多人可能为了图方便,任意挥洒着自己的才华,想怎么写就怎么写,能达到效果就行,这也有点小消极哈,忘了你的优秀工程师目标了麻?!~~css规则虽不不难,真正写好也不易,还是要有些追求极致的精神滴。诸君且写且珍惜吧!~
高维护性css
Css有些什么特点?
简单来说,使用方式:内联、内嵌、外联、import。为元素设置样式的方式:元素标签名、类名、id、各种选择器,以及它们的组合。所以,它是很灵活的,如果不做任何的规范的限制,就肯定会导致css代码的混乱和难以维护。
如何高效组织css代码?
结构清晰、模块分明,合理的代码组织结构可提高代码的重用性和可维护性,降低开发复杂度。那怎样组织呢?
首先是组织代码文件,可分为两大类:通用类和业务类。 然后,有一个文件用来重置,常见命名是reset或者default、normalize等。
有一个文件用来存放通用模块和一些基础样式,常命名为mod、common等,如页面对话框,提示框,头部,底部,侧边栏等,会在多个页面用到,这样方面各页面引用,提高代码复用度。
另外需要一个文件存在兼容旧版IE浏览器的样式,这样做的好处有二:
一、减少非IE浏览器加载样式文件的负担
二、如果未来决定不再支持旧版的IE浏览器,则只需要去修改一个文件,不需要多个文件到处找去修改。当然,在处理浏览器兼容问题上,有个原则是,是否有其他不存在兼容问题的方案,如果没有,则把要做兼容的部分单独放在一个文件中。
其余的css样式文件则用于业务模块,不同模块的样式文件放置于不同的文件夹中,原则上每个模块的样式文件不宜太大。
这样可能会造成一个问题,一个页面不是要引入很多文件了?页面加载的时候http请求不是多很多?其实并不矛盾,文件的划分只是为了方便开发和维护,发布的时候会使用工具把多个文件压缩合并成一个文件,所以不用担心引入多个文件的问题。
上面说的是文件的组织,那么在文件中也要按照一定规则来组织样式的声明。 比如,按照模块中元素的层级,如果是同级,则按照元素在页面中的位置,从上到下,或者从左到右,若存在多个元素共用相同声明,则应先声明共通样式。 如果觉得这样还不够,则可以使用一些更高级的方式,如less、sass,它们将css赋予了动态语言的特性,如变量、继承、运算、函数等。










