輕松書寫CSS的技巧有哪些

這篇文章給大家介紹輕松書寫CSS的技巧有哪些，內容非常詳細，感興趣的小伙伴們可以參考借鑒，希望對大家能有所幫助。

書寫CSS簡單實用的8個技巧

這篇文章主要幫助剛接觸CSS的朋友，通過該文章，可以幫助大家更好的理解CSS。

1.結構

保持CSS結構清晰，不僅有助于保持CSS文件的簡單，也利于日后的檢查、更改。

這種不推薦：

BODY

{margin-top:5px;  font-family:Arial,Helvetica,  sans-serif;font-size:14px;color:#3b5f83;}

推薦這種寫法：

BODY

{  margin-top:5px;  font-family:Arial,Helvetica,sans-serif;  font-size:14px;  color:#3b5f83;  }

2.保持簡潔

保持代碼簡潔，可以大幅減小CSS文件的大小。

不推薦：

padding-top:10px;   padding-right:5px;

可以簡寫：

padding:10px5px00;

3.Paddingvs.Margin

對于瀏覽器來說，Margin是兼容性最差的一個屬性。因此，只要條件允許，應該盡可能的使用Padding屬性。

4.整合

在下面的例子中定義了一個公共的Class，來代替不同的地方都要用到的相同的代碼：color:grey。

.header-content{   font-size;12px;   color:grey;   }   .body_content{   font-size:12px;   color:grey;   }   .footer_content{   font-size:11px;   color:grey;   }

其實可以這樣：

*{color:grey;}   .body_content{font-size:12px;}   .footer_content{font-size:11px;}

5.注釋

在適當的位置加入一條簡單的注釋，不僅有助于你了解代碼，其他人也可以很好的理解你的代碼。

/*這里開始定義網址www.zdbase.com*/

6.驗證

***對已經創建好的CSS文件進行驗證，這樣可以幫助你找到文件中存在的錯誤。

7.避免在XHTML中使用樣式

不要在Xhtml代碼中使用樣式，這樣不僅會增加網頁文件的大小，而且也會使代碼混亂，變復雜。例如下面這種不推薦：

<divstyledivstyle="color:redpadding:20px">  <h3>這種用樣式的方法不好h3>  div>

8.命名

使用標準的可以從字面上正確理解的ID和Class名稱，而不僅僅是代號。

下面這種不推薦：

.a1{color:grey;}   .b1{font-size:11px;}

推薦這種寫法：

.body_content{color:grey;}   .foot_content{font-size:11px;}

關于輕松書寫CSS的技巧有哪些就分享到這里了，希望以上內容可以對大家有一定的幫助，可以學到更多知識。如果覺得文章不錯，可以把它分享出去讓更多的人看到。