css:oo css

2017-01-04 10:33:18来源:segmentfault作者:lx_blog人点击

第七城市
oo css

既面向对象的css


作用

1.加强代码的复用方便维护。
2.减小css体积。
3.提升渲染效率。
4.组件库思想、栅格布局可共用、减少选择器、方便扩展。


注意事项

1.不要直接定义子节点,应把共性声明放到父类。
2.结构和皮肤相分离。
3.容器和内容想相分离。
4.抽象出可重用的元素,建好组件库,在组件库内寻找可用元素组装页面。
5.往你想要扩展的对象本身增加class而不是他的父节点。
6.对象应保持独立性。
7.避免位置相关的样式。
8.避免使用id选择器,权重太高,无法重用。
9.保证选择器相同的权重。
10.类名 简短 清晰 语义化 oocss的名字 并不影响html语义化。


比如

neat.css less.css sass.css等


less 和 sass 区别

less基于javascript 用于日常工作代码中。
sass基于ruby 用于写大型的基础库。

第七城市

最新文章

123

最新摄影

微信扫一扫

第七城市微信公众平台