考虑以下三种情况......
情景A
@import "reset.css";
/* ... */
p {margin:1em 0;}
/* ... */
p#copyright {margin:0; padding:10px;}
在方案A中，泛型规则应用于所有<p>元素，这些元素为其提供了上边距和下边距，以便在HTML中使用时段落间隔适当。但是，通过这样做，这会导致<p>元素现在需要将其通用边距移除以用于装饰目的，例如，文件底部的版权必须没有边距。
情景B
@import "reset.css";
/* ... */
div.content_body p,
div.sidebar_body p {margin:1em 0;}
/* ... */
p#copyright {padding:10px;}
在场景B中，假设<p>元素不需要顶部和底部边距，除非明确定义。这里的内容和侧边栏元素需要间距很大的段落
情景C
@import "reset.css";
/* ... */
p.spaced {margin:1em 0;}
/* ... */
p#copyright {padding:10px;}
在方案C中，只有<p>个类spaced元素才会应用上边距和下边距。
问题：
哪种情况更好用，更重要的是为什么？ 每种情况都会产生什么影响：
如果你必须添加一个需要流动段落的新窗口小部件，哪种场景对你更好？
谢谢！
答案 0 :(得分：2)
Generic首先是因为最好先允许所有内容然后稍后阻止。 ：）
答案 1 :(得分：2)
我尝试遵循这样的原则，即朴实的选择器（如“p”本身）应提供合理的默认值，然后使用更具体的选择器来覆盖这些默认值。我认为最好用场景A和B 来表示。
如果标记很简单，并且存在良好的全局默认值，那么我的样式表看起来就像是场景A.
如果标记不那么简单，或者很难定义全局默认值，那么我的样式表看起来更像场景B.
我尝试尽可能避免场景C 。我希望我（或其他人）在6个月后添加新内容非常容易。我发现：
更少的专业类，更容易“陷入成功之中”，因为你写的最简单的东西（<p>Whatever</p>）才会起作用。
more 专门的类，你需要练习复制/粘贴编程以保持一致的标记使用的可能性越大。
当类语义时，CSS的效果更好，并且描述 的内容比表示时更好，并描述如何内容应显示。场景C是表示样式的一个例子，它只比内联样式略好。
答案 2 :(得分：1)
这完全取决于您网站的设计。
如果网站上的大多数段落都有边距，但有一些不具有边距，则A中的方法需要的代码最少，因此可能会导致较低的CSS权重和更高的可维护性。
但是如果你的内容和侧边栏区域中的段落只需要边距（或者它们之外没有很多段落），那么B中的方法是更好的主意。
至于C中的方法，我主要担心的是如何生成网站的HTML。如果它是由后端系统生成的，那么该系统必须知道哪些段落应该间隔，哪些不应该。这是系统或其用户处理的额外复杂性。
对于段落的具体例子，我经常得到像B这样的东西。很容易假设段落应该有一些漂亮，不错的样式，比如一篇很好看的文章。但是如果你看看大多数现代网站，页面上的大部分内容都不是那样的内容：它是菜单和侧边栏以及特殊的小东西。现在，这可能不是很好，设计方面，但如果你实现这样的设计，B是用更少的代码来做到这一点的方法，而更少的代码通常意味着更轻的重量，更容易的可维护性和更少的缺陷。 / p>
答案 3 :(得分：0)
我个人更喜欢情景A.我发现如果你这样做，你可以充分利用级联。你必须问自己的问题是“什么是明智的默认？”意思是p更可能需要间距，或者更可能不需要间距。这应该可以帮助您确定您的一揽子默认值。一般来说，这个问题的答案是让你与情景A保持一致。
答案 4 :(得分：-1)
D以上都不是
@import ""; // don't need this
p { } // don't need this
ul#footer li { padding: 10px }
浏览器制造商特别了解他们的技术以及排版和布局。 “重置”是处理所有聚合体验的好方法。浏览器默认行为是一件好事，只应在特殊情况下覆盖。不同的浏览器做看起来有点不同。这不是一件坏事。请参阅：http://dowebsitesneedtolookexactlythesameineverybrowser.com/
版权引用不是一段文字。关于相关页面的支持信息列表中的几个项目之一可能。如果没有，则列出一个。