css:oo css

2017-01-05 △ 凉夏*

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 用于写大型的基础库。

内容来源:https://segmentfault.com/a/1190000007999959


用户评论
开源开发学习小组列表