1. 程式人生 > 實用技巧 >CSS規範

CSS規範

空格規範

【強制】 選擇器與{之間必須包含空格。

示例:

.selector {
}

【強制】 屬性名與之後的:之間不允許包含空格, :與屬性值之間必須包含空格。

font-size: 12px;

選擇器規範

【強制】 並集選擇器,每個選擇器宣告必須獨佔一行。

示例:

/* good */
.post,
.page,
.comment {
    line-height: 1.5;
}


/* bad */
.post, .page, .comment {
    line-height: 1.5;
}

【建議】 一般情況情況下,選擇器的巢狀層級應不大於 3 級,位置靠後的限定條件應儘可能精確。

示例:

/* good */
#username input {}
.comment .avatar {}

/* bad */
.page .header .login  input {}
.comment div * {}

屬性規範

【強制】 屬性定義必須另起一行。

示例:

/* good */
.selector {
    margin: 0;
    padding: 0;
}

/* bad */
.selector { margin: 0; padding: 0; }

【強制】 屬性定義後必須以分號結尾。

示例:

/* good */
.selector {
    margin: 0;
}

/* bad */
.selector {
    margin: 0
}