css - 哪个 CSS 代码片段的可维护性和性能更好

Question

我有 2 个代码片段。

这是代码片段 1:

#question-title-1 {
 cursor:pointer;
 color:blue;
 padding:10px;
}

#question-title-2 {
 cursor:pointer;
 color:red;
 padding:10px;
}

片段 2:

#question-title-1 , #question-title-2 {
  cursor:pointer;
  color:blue;
  padding:10px;
}

#question-title-2 {
  color:red;
}

哪一个更好，为什么？ 我更喜欢 2，因为它需要更少的代码行。另一方面，我认为重新定义颜色属性将导致浏览器中重新绘制。

Answer 1

我将使用 3 个 CSS 声明，这样您就不会执行任何覆盖或重复的属性:

#question-title-1,
#question-title-2 {
   cursor:pointer;
   padding:10px;
}

#question-title-1 { 
 color:blue; 
}

#question-title-2 {
 color:red;
}

更多的行，但减少行不应该成为结构化 CSS 的首要任务。