OOCSS(Object-Oriented CSS,Github、FAQ),面向对象的CSS,典型案例是BootStrap,toggle组件的示例如下:
1 | <div class="toggle simple"> |
主要原则有以下两个:
- 分离结构和外观:意味着将视觉特性定义为可复用的单元,如上例中
toggle
、toggle-control
、toggle-title
和toggle-detail
4个类是结构类,simple是外观类。 - 分离容器和内容:指的是不再将元素位置作为样式的限定词,如上例中
toggle
、toggle-control
、toggle-title
和toggle-detail
4个类。