css 外边距合并是什么意思

css外边距合并是指当两个垂直外边距相遇时,它们将形成一个外边距,并且合并后的外边距的高度等于两个发生合并的外边距的高度中的较大者;但是只有普通文档流中块框的垂直外边距才会发生外边距合并,而行内框、浮动框或绝对定位之间的外边距不会合并。

css 外边距合并是什么意思

本文操作环境:Dell G3电脑、Windows7系统、css3版。

推荐:《css视频教程》

css 外边距合并是什么意思?

外边距合并指的是,当两个垂直外边距相遇时,它们将形成一个外边距。

立即学习“前端免费学习笔记(深入)”;

合并后的外边距的高度等于两个发生合并的外边距的高度中的较大者。

外边距合并(叠加)是一个相当简单的概念。但是,在实践中对网页进行布局时,它会造成许多混淆。

简单地说,外边距合并指的是,当两个垂直外边距相遇时,它们将形成一个外边距。合并后的外边距的高度等于两个发生合并的外边距的高度中的较大者。

当一个元素出现在另一个元素上面时,第一个元素的下外边距与第二个元素的上外边距会发生合并。请看下图:

d4ec1da130f90aa843c867940d72a45.png

当一个元素包含在另一个元素中时(假设没有内边距或边框把外边距分隔开),它们的上和/或下外边距也会发生合并。请看下图:

e33e0bc030957286a865084db9108a1.png

外边距合并初看上去可能有点奇怪,但是实际上,它是有意义的。以由几个段落组成的典型文本页面为例。第一个段落上面的空间等于段落的上外边距。如果没有外边距合并,后续所有段落之间的外边距都将是相邻上外边距和下外边距的和。这意味着段落之间的空间是页面顶部的两倍。如果发生外边距合并,段落之间的上外边距和下外边距就合并在一起,这样各处的距离就一致了。

注释:只有普通文档流中块框的垂直外边距才会发生外边距合并。行内框、浮动框或绝对定位之间的外边距不会合并。

以上就是css 外边距合并是什么意思的详细内容,更多请关注【创想鸟】其它相关文章!

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容, 请发送邮件至253000106@qq.com举报,一经查实,本站将立刻删除。

发布者:PHP中文网,转转请注明出处:https://www.chuangxiangniao.com/p/2954628.html

(0)
上一篇 2025年3月12日 00:10:40
下一篇 2025年3月12日 00:10:51

AD推荐 黄金广告位招租... 更多推荐

相关推荐

  • css svg不显示不出来怎么办

    css svg不显示不出来的解决办法:1、使用标签引入svg文件;2、使用标签引入svg文件;3、使用标签引入svg文件。 本教程操作环境:Dell G3电脑、Windows7系统、HTML5&&CSS3版本。 推荐:《cs…

    2025年3月12日
    100
  • css的rem是什么

    css的rem是一种css单位,rem的英文全称是“font size of the root element”,是指相对于根元素的字体大小的单位;而em是指相对于父元素的字体大小的单位。 本文操作环境:Windows7系统,Dell G3…

    2025年3月12日
    200
  • css padding什么意思

    css padding是一个简写属性,定义元素边框与元素内容之间的空间,即上下左右的内边距;当元素的 padding内边距被清除时,所释放的区域将会受到元素背景颜色的填充;单独使用padding属性可以改变上下左右的填充。 本文操作环境:W…

    2025年3月12日
    200
  • CSS %是什么单位

    CSS %是指百分比,指的是一个相对长度单位,是相对于包含块的高宽或字体大小来取值;如果某个元素设置了百分比的属性,则后代元素继承的是计算后的值。 本教程操作环境:windows7系统、css3版本,Dell G3电脑。 相关推荐:《css…

    2025年3月12日
    200
  • css语法错误有哪些

    css语法错误有:1、写错属性名或者选择器名,并且属性值不符合规范;2、错误使用中文或者全角符号;3、html标签没写完整,漏了“”等。 本教程操作环境:windows7系统、Chrome76.0&&CSS3版本,Dell …

    2025年3月12日
    200
  • css是利用什么XHTML标记构建网页布局

    css是利用的XHTML标记构建网页布局;XHTML是相对HTML来说的,比html更严格,指的是网页结构规范等,而css是用来美化各部分结构;html利用div标签实现整体的网页布局,利用css实现网页的显示效果。 本教程操作环境:win…

    2025年3月12日
    200
  • css 等宽字体有哪些

    css等宽字体有Menlo、Monaco、Courier New、monospace等,其等宽字体指的是在同样的font-sieze下每个字符占据的宽度一样。 本教程操作环境:windows7系统、css3版本,Dell G3电脑。 相关推…

    2025年3月12日 编程技术
    200
  • css中box是什么文件

    css中box是指CSS盒子模型,即Box Model;在CSS中,“box model”这一术语是用来设计和布局时使用;CSS盒模型本质上是一个盒子,封装周围的HTML元素,它包括边距、边框、填充和实际内容。 本教程操作环境:Window…

    2025年3月12日 编程技术
    200
  • p的css初始属性是什么

    p的css初始属性是“color:#000000;font:16px Microsoft YaHei;margin:16px 0;”,不同浏览器的p的css初始属性是不同的,我们可以使用浏览器的开发者工具查看即可。 本教程操作环境:Wind…

    2025年3月12日
    200
  • css切图是什么意思

    css切图是指DIV CSS开发的意思,表示从一张网页美工图切片到HTML代码开发与CSS样式开发,完成HTML静态网页;css切图包含两部分,分别是:1、网页美工图素材切出;2、DIV+CSS代码开发。 本文操作环境:windows7系统…

    2025年3月12日
    200

发表回复

登录后才能评论