高效的CSS程式碼(2)

——閱讀筆記，歡迎糾錯^_^

內容比較零散。。。。。

1.讓浮動元素的父容器根據元素的高度而自適應高度的方法：

<div class=”clearfix”><div class=”fl”></div></div>

/*意思就是最外面的一層<div></div>是父容器，給他加上清除浮動的功能，clearfix的程式碼再高效的CSS程式碼（1）中有*/

2.再寫程式碼前不是要先分析一下頁面的模組嗎，模組的劃分也能間接影響程式碼的效率，寫CSS程式碼劃分模組可以遵循：

　　1）模組與模組之間儘量不要包含相同的部分，若有相同的部分應將其提出並分成一個獨立的模組；

　　2）儘量提高模組的重用度，就是模組再保證模組數量儘可能少的原則下做到儘可能簡單以提高重用度；

3.想必大家都會有時候命名多的時候就不知道怎麼給盒子取名字了

　　1）峰駝式：從第二個單詞開始講首字母大寫化；（用於區別不同單詞）

　　2） 劃線式：用_或者-來連線命名；（用於表明從屬關係）

命名儘量體現從屬關係比較好

這兩張命名方法不僅僅再CSS中使用再JS或者C等語言也闊以用啊，小雜就只學了兩種。。。勿噴。。。。還在努力啊！

PSPSPS：如果是團隊合作寫程式碼的話，再寫之前團隊商量一下，每個人都有自己一個獨特的標示符作為字首避免團隊合作程式碼的衝突啊！！！

3.接下去說個小雜使用後頗有心得而且感覺真真闊以的！——多嘗試使用類的組合

！！！記得有段時間再寫多個頁面，程式碼命名不言而喻亂七八糟，。。。後來經過類的組合修改。。。程式碼量大幅度減少，看起來也是一目瞭然！！！！

4.最好統一使用margin-top或者margin-bottom

為啥？我之前也是亂用，後來再除錯瀏覽器相容性時候就是個蛋！，經過修改統一margin後竟然好了！具體願意為啥。。百度有哦~~~

如果不確定模組的上下margin特別穩定，最好不要講他寫到模組裡，而是使用類的組合，單獨的為上下margin掛用編劇的原子類，而且！！！最好模組不要混用margin-top和margin-bottom，貌似這個後來又修改了只用padding的。。貌似更好；

 

作者：承蒙時光

出處：http://www.cnblogs.com/timetimetime/

本文版權歸作者和部落格園共有，歡迎轉載，但未經作者同意必須保留此段宣告，且在文章頁面明顯位置給出原文連線，否則保留追究法律責任的權利。