Twitter Bootstrap和其他项目是否有理由覆盖段落等元素的默认浏览器边距?
浏览器默认(顶部和底部1em边距):
p { margin: 1em 0; }
Twitter Bootstrap(仅在底部10px边距):
p { margin: 0 0 10px; }
我的偏好(10px边距,或垂直节奏长度,在顶部和底部):
p { margin: 10px 0; }
以下是我的想法:
在顶部和底部有保证金,我可以依靠保证金折叠来确保元素之间的保证金不会太大。我确信应该与其他元素隔开的元素将是。
只有底部的边距,我必须在带有衬垫的容器中放置段落和类似物,或者将它们与它们上方的元素齐平,或者将边缘底部应用于可能位于它们上方的任何东西,以确保设计间隔进行。
总的来说,我更喜欢浏览器默认设置。有什么我想念的吗?是否有讨论此主题的博客或文章?
答案 0 :(得分:4)
这个小提琴应该说明原因:http://jsfiddle.net/men62/1/
关于文本与容器和其他元素的一致布局。
答案 1 :(得分:2)
我不太确定自己,但我想,因为在编写规则和印刷设计时我们都习惯于这套规则:每个段落都应该有一些余地。
我记得在一段时间前我写过的一篇写作课,每段的底部边距表示新段落的开头。如果无法应用底部边距,也可以使用缩进作为新段落的标记。 Wikipedia has some explanation基于Robert Bringhurst的书,印刷风格的元素:
印刷风格元素表明“至少有一个en [空格]“应该用于在第一个之后缩进段落, 注意到这是“实际的最低限度”。
...
其他技术也是可能的。线条可以缩进以表示 新段落的开头。另一种技术是插入垂直 段落之间的空间。这创造了有时被称为的东西 “阻止段落”。
在Microsoft Word等字处理器软件上,默认情况下也会设置每个段落底部有一些间距(通常为10pt)。当它被应用到网络上时,似乎占据了底部边缘技术。
blog post from Marco Dugonjic似乎暗示“设置底部边距等于元素的线高确保正确的垂直方向。”