文章為csslint中文版譯文，點擊原文可查看英文版，如遇到翻譯錯誤或錯別字啥的，請留言指出~ 譯文內容不定期更新~ 返回目錄

在早先網頁開發中,相同的CSS屬性出現了兩次則毫無疑問是錯誤的,特別是 如果有兩個不同的值,如下:

.mybox {
    width: 100px;
    width: 120px;
}

任何人看到此處的代碼都清楚的知道是錯誤的。但是,最近呢,復用屬性可以用來解決 高低版游覽器對CSS屬性的支持度情況。舉個例子,部分游覽器支持RGBA色彩,而其它的則不行,那么 出現以下的示例就顯得十分正常合理了:

.mybox {
    background: #fff;
    background: rgba(255, 255, 255, 0.5);
}

此處重復是很明顯的有意為之。開發者想在支持RGBA的游覽器上使用其效果,而不支持的游覽器則使用傳統的純色。

規則詳情

規則 ID: duplicate-properties

此規則 意在找出重復定義的CSS代碼。警告將出現在:

1. 屬性出現兩次且為相同的值。
2. 屬性出現兩次且被至少一個其它的屬性所隔開。

以下示例將會提示警告:

/* properties with the same value */
.mybox {
    border: 1px solid black;
    border: 1px solid black;
}

/* properties separated by another property */
.mybox {
    border: 1px solid black;
    color: green;
    border: 1px solid red;
}

以下示例將 不會提示警告:

/* one after another with different values */
.mybox {
    border: 1px solid black;
    border: 1px solid red;
}