1)
a)即使在CSS文件中我们没有为特定的块(例如<p>
)指定 margin属性,浏览器仍会显示它,好像此块之前有一个换行符之后。这个空间(让我们称之为“默认”空间 dS )被认为是边距有一些默认值吗?
b)
我认为如果我在<p>
元素中添加(在CSS文件中)一个值为 1px 的margin属性,那么空间低于及高于{{1应该增加一个像素?因此,如果 dS 由 15 像素组成,那么新空间应该具有 16 像素的高度?
但情况似乎并非如此!即,如果我将 11px 的值分配给 margin属性,<p>
上方和下方的空格似乎没有 26 <的高度/ em>像素( dS + 11px = 15px + 11px = 26px )。实际上,高度似乎与 margin属性分配值 1px 时的高度相同。
因此,似乎在 margin属性被赋予等于或大于某个预定数量的值之前, margin属性将被忽略并且改为使用dS ?
答案 0 :(得分:1)
好像你可能正在观察正在应用的各种浏览器的default styles for HTML 4。
为了解决您的第二个问题,这个article on margin collapsing可能会有用。
摘自文章:
大多数块元素都有默认顶部 和底部边距,如段落 和标题,例如,可能 有1em的上下边距, 如果是,则计算为16像素 当前的字体大小。 这是什么 造成两者之间的差距 段落即可。这也是导致什么的原因 保证金崩溃非常重要。
[...]
段落顶部可能有16个像素 底部边距,而DIV为0. As 结果,DIV和DIV之间的差距 段落在每种情况下都是16像素。 这两段之间的差距是 也有16像素,即使有 两段,它们可能是 预计之间有32个像素 他们。 这是保证金崩溃。
[...]
保证金崩溃发生 顶部或底部两个(或更多)的地方 利润率很高。基本的想法 当他们触摸时,而不是 得到两个边距的总和, 使用较大的一个,另一个 被忽略了。所以在两者的情况下 段落,16像素底部边距 第一个触及16个像素 第二个上边缘。 Max(16,16)是16,之间的差距 它们是16像素。
答案 1 :(得分:1)
1)
a)即使在CSS文件中我们也没有 为a指定保证金属性 特定块(如
),浏览器 仍然显示它就像这个块一样 它之前和之后的换行符。是 那个空间(让我们称之为“默认”) 空间和dS)被视为边际 一些默认值?
浏览器有一个所谓的默认样式表,它适用于元素。换行符是因为它是块样式元素。这与利润无关。
我会假设如果我添加(内部 CSS文件)到
元素的边距 那么值为1px的属性
下面和上面的空间应该是 增加一个像素?所以如果dS 由15个像素组成,然后是新的空间 应该有16像素的高度?
不,如果在元素上应用边距,则会覆盖默认样式。所以它只是1px;
答案 2 :(得分:1)
这些都是非常好的问题。你能用CSS发布一些示例html来更好地描述问题#2。
对于问题#1,所有元素都有每个浏览器的默认设置,其中一些包括默认值。有些人喜欢重置所有CSS样式,以确保它们在浏览器和平台上得到某些期望。有关如何执行此操作的一个很好的示例,请参阅http://meyerweb.com/eric/thoughts/2007/04/12/reset-styles/。
不同的浏览器不仅根据其盒子模型的不同解释来测量高度(参见http://www.communitymx.com/content/article.cfm?cid=E0989953B6F20B41),但边缘在相邻时会倾向于“折叠”,因此存在共享空间在元素的边缘之间(见http://www.howtocreate.co.uk/tutorials/css/margincollapsing)。
希望这有帮助。
答案 3 :(得分:1)
听起来你正在遇到“崩溃边缘”。如果有两个元素的顶部/底部边距不匹配,则使用较大的值(还有其他规则可以控制边距折叠,但这是基础)。
如果您对<p>
元素应用1px的边距,那么它们之间只有一个像素,但如果你有,则高于它们<h2>
,将使用<h2>
(可能更大)的保证金。如果您将<p>
上的上边距增加到大于<h2>
上的下边距,则它们之间的间距会增加。这就是给你一个“最低保证金”的错觉。
要 de 增加<h2>
和<p>
之间的空间,您需要减少<h2>
的底部边距和 <p>
的上边距。