首页   注册   登录
V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
Can I use?
http://caniuse.com/
Less
http://lesscss.org
Cool Libraries
Bootstrap from Twitter
Jetstrap
V2EX  ›  CSS

为什么<p>标签的 margin 和其他块级标签的 margin,上下边距会重叠计算,但和<video>的 margin 却不会重叠计算?

  •  
  •   lisisi · 124 天前 · 1171 次点击
    这是一个创建于 124 天前的主题,其中的信息可能已经有所发展或是发生改变。

    例 1:

    <p style="margin: 10px 0">this is paragraph</p>
    <h1 style="margin: 10px 0">This is heading 1</h1>
    

    例 2:

    <p style="margin: 10px 0">this is paragraph</p>
    <video style="margin: 10px 0" src="#">This is video</video>
    

    例 1 中,p 和 h1 之间的总 margin 实际是 10px ( p 的 margin-bottom 和 h1 的 margin-top 重叠计算了);
    例 2 中,p 和 video 之间的总 margin 实际是 20px ( p 的 margin-bottom 和 video 的 margin-top 没有重叠计算)。

    2 回复  |  直到 2019-08-06 18:01:08 +08:00
        1
    suinia   124 天前   ♥ 1
    margin 重叠 只发生在 block 元素上, 只发生在垂直方向上
        2
    meepo3927   124 天前
    <video /> 默认不是块级元素
    关于   ·   FAQ   ·   API   ·   我们的愿景   ·   广告投放   ·   感谢   ·   实用小工具   ·   2335 人在线   最高记录 5043   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.3 · 22ms · UTC 14:53 · PVG 22:53 · LAX 06:53 · JFK 09:53
    ♥ Do have faith in what you're doing.