CSS規范性對于網頁設計者和開發者來說是非常重要的,它保證了代碼的可讀性和可維護性。以下是一些關于CSS規范性的實踐方法。
/* 1.選擇器格式 */ /* 推薦 */ .page-header { font-size: 20px; } /* 不推薦 */ .pageHeader {font-size: 20px;} .page_header {Font-Size: 20px;} /* 2.代碼縮進 */ /* 推薦 */ .page-header { font-size: 20px; } /* 不推薦 */ .page-header { font-size: 20px; } /* 3.屬性順序 */ /* 推薦 */ .page-header { display: block; background-color: #fff; color: #333; font-size: 20px; } /* 不推薦 */ .page-header { color: #333; font-size: 20px; display: block; background-color: #fff; } /* 4.注釋規范 */ /* 推薦 */ /* Header 樣式 */ .page-header { font-size: 20px; } /* 不推薦 */ /* 樣式 */ .page-header { font-size: 20px; } /* 5.單位使用 */ /* 推薦 */ .page-header { font-size: 20px; margin: 10px; } /* 不推薦 */ .page-header { font-size: 1.25rem; /* 使用rem單位 */ margin: 10px 10px 10px 10px; /* 縮寫方式 */ } /* 6.選擇器使用 */ /* 推薦 */ /* 僅當它是必要的時候使用ID選擇器 */ #header {} /* 建議使用class選擇器 */ .page-header {} /* 不推薦使用標簽選擇器 */ header {} /* 7.顏色值格式 */ /* 推薦 */ .page-header { background-color: #ffffff; color: #333333; } /* 不推薦 */ .page-header { background-color: white; color: grey; }
總之,遵循CSS規范性可以使你的代碼更加清晰、易于維護并且可以讓你的團隊更好的協作。如果您還沒有遵循規范,請嘗試使用上述的實踐方法。
上一篇css計算寬度的寫法
下一篇css解決ios和安卓的