css - 我应该在 CSS 中重写以前的值还是重复规则？

Question

就最佳实践而言，其中哪一个是“更好的 CSS 代码”？

A - 重写:

@media only screen and (min-width: 480px) and (max-width: 960px) {
  h1, h2, .header, .widget, .copyright {
    position: static;
    width: 100%;
    height: auto;
    /* a lot more styles may be here */
  }
  .copyright {position: relative;}
}

B - 重复:

@media only screen and (min-width: 480px) and (max-width: 960px) {
  h1, h2, .header, .widget {
    /* CLASS .copyright is missing here to avoid rewriting */
    position: static;
    width: 100%;
    height: auto;
    /* a lot more styles may be here */
  }
  .copyright {position: relative; width: 100%; height: auto; /* a lot more of the SAME styles may be here */}
}

重写会产生一些负面影响吗(图表 A)？渲染速度变慢，旧版浏览器出现问题..？我不知道为什么，但这对我来说似乎不对 - 尽管这样做更容易。

Answer 1

速度可能是一个小问题，但整体问题是代码的可读性。展望 future ，您或其他人想要编辑，更容易对 A 进行更改而不是 B。