oocss

“面向对象的编程”的概念，开发商之间普遍存在的，他成为任何现代编程语言的一种基本形式，数据的抽象化、模块化和继承等特点在编写代码中得到了大规模的应用。面向对象的CSS是一种容易重用的一种CSS规则，也是OOP的概念，从而降低了页面的加载时间，提高了网面的性能。这里关键的一点就是如何在页面中识别，创建和模块化可重用的对象，并在页面中任何需要的地方重用，并扩展其附加功能。在这里我们所说的对象其实很简单，就是指基本的HTML标签和CSS样式规则。现在最关键的，也是最具有挑战性的一点就是确定“对象”，并给这个对象创建CSS样式规则。

引用OOCSS之父Nicole Sullivan话来说， 面向对象的CSS有两个原则：

• 独立的结构和样式
• 独立的容器和内容

总而言之就是把常用的css样式拆分成零件。

$oocss();

/*编译后*/
.mid{width:980px;margin:0 auto;}
.mids{position:absolute;top:0;left:50%;width:980px;margin-left:-490px;}
.no_txt{overflow:hidden;font-size:0;line-height:0;text-indent:-9999px;}
.clear{clear:both;}
.clearfix:after{display:block;clear:both;height:0;content:'';}
.clearfix{\*zoom:1;}
.txt_cut{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;}
.por{position:relative;}
.poa{position:absolute;}
.pos{position:static;}
.dis_i{display:inline !important;}
.dis_b{display:block !important;}
.dis_ib{display:inline-block !important;}
.nobgcolor{background-color:#fff !important;}
.f_n{float:none !important;}
.f_l{float:left !important;}
.f_r{float:right !important;}
.m_0{margin:0 !important;}
.m_t_10{margin-top:10px !important;}
.m_b_0{margin-bottom:0 !important;}
.m_b_10{margin-bottom:10px !important;}
.m_b_20{margin-bottom:20px !important;}
.m_b_30{margin-bottom:30px !important;}
.m_b_40{margin-bottom:40px !important;}
.m_b_50{margin-bottom:50px !important;}
.m_t_0{margin-top:0 !important;}
.m_t_10{margin-top:10px !important;}
……