Community Learn Tools Library Leisure
search
English
Home > Web Front-end > HTML Tutorial > body text

Margin外边距叠加_html/css_WEB-ITnose

WBOY
Release： 2016-06-24 11:34:00
Original
1288 people have browsed it

外边距(Margin)叠加

只有普通文档流中块级元素(块框)的垂直外边距才会发生外边距叠加。行内框、浮动框和绝对定位框之间的外边距不会叠加

  • 两个相邻兄弟块框

  • 父元素与子元素，并 父元素没有内边距或边框时 ,它们的顶和/或底外边距也会发生叠加。

    • 当父元素没有内边距或边框时

    当父元素有内边距或边框时

    无论子元素是否有内边距或者边框都不会影响叠加

  • 自己的垂直上下外边距叠加

  • 叠加具有组合性，而组合都是上面几种情况的组合，万变不离其中!

    • Related labels：
    Margin外边距叠加
    source：php.cn
    Previous article：css:outline_html/css_WEB-ITnose Next article：CSS的4种引入方式及优先级_html/css_WEB-ITnose
    Statement of this Website
    The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
    Latest Articles by Author
    Latest Issues
    Parent's padding ignored by sticky positioned child How to prevent sticky elements from going behind the header? The current code snippet uses...
    From 2024-04-06 11:42:51
    0
    1
    338
    Related Topics
    More>
    Popular Recommendations
    Popular Tutorials
    More>
    Related Tutorials
    Popular Recommendations
    Latest courses
    Latest Downloads
    More>
    Web Effects
    Website Source Code
    Website Materials
    Front End Template