談CSS書寫風格

隨著公司業務的增加，需求變的越來越多，團隊也因此在不斷的擴大，我們經常會遇到幾個人協同工作來完成同一件作品或維護修改別人作品的時候，那麼是什麼最讓你最感到困擾呢？我們在實現一個表現複雜的頁面的同時，CSS檔案就會比較繁瑣，眾多的選擇符、屬性讓人眼花撩亂，那麼如何更快的定位、如何更有效率的寫作樣式呢？ CSS的書寫被很多人忽略。關於書寫風格，翻看了一些知名網站的作品，發現橫向連排幾乎成為各大產品項目的主流，然而，每個人對於CSS的寫法各異，這就導致我們工作效率的降低。為了更好的協同工作，保持團隊內CSS書寫的一致性，幾經波折後達成共識，具體書寫方法如下：CSS屬性橫排書寫，選擇符縱排書寫，每個”,”(逗號)後必須換行;

重構組代碼書寫規範範例：（其中數字只用做示範，實際應用中不建議用數字命名。）

.class_name_1 .class_name_1_1,
.class_name_2 .class_name_2_1 .class_name_2_1_1,
.class_name_3{style1:value; style2:value; styel3:value; }

有人說，好程式碼就是用記事本打開也是藝術品，而樣式檔案本身就是設計作品。目前並沒有一個權威來界定這種規範，我們只能對兩種寫法做個簡單的總結。

就樣式文件本身對比：

縱向書寫特色：

1. 每個CSS屬性獨立一行，一般不會出現換行或橫向捲軸。
2. 可以透過firebug等工具查找到模組，在DW中ctrl+g行定位，修改方便。
3. 屬性段落間有縮排，確保了程式碼的整潔，層次清楚，符合程式語言程式碼規範，修改更直觀。

存在的問題：程式碼冗餘（如空格符、tab符、換行符）；檔案大小增加；容易出現縱向捲軸。