在編寫CSS樣式表時(shí),我們需要遵循一些常規(guī)的規(guī)則來保持樣式表的可讀性和易于維護(hù)。下面是一些常見的CSS編寫規(guī)則:
/* 1.先寫選擇器,再寫花括號(hào) */ h1 { font-size: 24px; font-weight: bold; } /* 2.屬性名和屬性值之間用冒號(hào)隔開 */ p { color: #333; font-size: 16px; } /* 3.屬性名和屬性值之間用一個(gè)空格隔開 */ a { color: blue; text-decoration: none; } /* 4.多個(gè)屬性之間用分號(hào)隔開 */ h2 { font-size: 20px; color: #666; margin-bottom: 10px; } /* 5.選擇器和屬性之間留一個(gè)空行 */ .btn { background-color: #fff; border: 1px solid #ccc; padding: 5px 10px; } /* 6.使用縮寫屬性 */ .box { margin: 10px 20px; padding: 5px; } /* 7.使用CSS變量 */ :root { --main-color: #2e96b7; } .btn { background-color: var(--main-color); color: #fff; } /* 8.注釋代碼 */ /* 按鈕樣式 */ .btn { background-color: #2e96b7; /* 主色 */ color: #fff; }
以上是一些常見的CSS編寫規(guī)則,遵循這些規(guī)則能使我們的CSS樣式表更清晰易懂,更容易維護(hù)。