自動化高效css開發，暢談less的靈活變化

　　css是一種讓html與樣式分離解析而出現的代碼，它的出現大大提高了程式員的工作效率，和後期進行維護的效率。但是發展至今，由於起死板單調的寫法，越來越不能滿足程式員們靈活的思維，很多時候是種恨鐵不成鋼的心情來寫css，於是，有一些聰明的程式員就發明了less。

　　less是為了簡化css開發，靈活css開發而出現的，其功能非常強大，靈活性也很高，上手也很快，所以越來越受到前端開發的青睞，其中的基本文法我就不講了，相信度娘上有無數的教程可以參閱，我就來講點利用less靈活的特點做的一些東西。

　　1 less 解決 css3 的相容首碼

 { :; :; :; : }
#box{.box-shadow(2px 2px 3px #ccc);}//調用

以此類推，老闆再也不用擔心我的css3跨瀏覽器安全色了；

 

　　2 以代碼塊的方式封裝less功能

 { :;:;  :;:     } { :;:;:;:; :; }  #xx_list{.list(4, 1030px, 10px);}//調用，參數為：一行顯示4個，總寬度，行間距

直接就能出item列表了，（.cf為清除浮動less，具體代碼如下：）

 { :;:; :;:;:;:;:} 

 

　　3 less寫自訂色彩漸層按鈕以及按鈕偽類

 { :; :; :; :; :; :; } {  :;:;:; : ;     } { :;     } .btns{.btn(@tcolor, 3px); padding: 15px 50px;}//調用

一次性又搞定了漸層，搞定了按鈕的偽類，cool！

 

　　4 全域參數設定網站主題

調用的時候寫對應參數，如果可能，用好less的顏色計算功能，就能調試好整個網站的配色，讓你的網站一點也不單調！