CSS中的Clearance到底是什么

What exactly is CLEARANCE in CSS(CSS中的Clearance到底是什么)
本文介绍了CSS中的Clearance到底是什么的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

因此,我已经开始阅读CSS规范,以便更好地理解如何在代码中使用样式属性和属性。当前在Box模型上-折叠边距,http://www.w3.org/TR/CSS2/box.html#collapsing-margin,我在规范中遇到了这一行。

如果带有间隙的元素的上边距和下边距为 毗邻,它的边际崩溃,与毗邻的边际 跟随兄弟姐妹,但由此产生的边距不会随着 父挡路的下边距

有没有人愿意解释一下上面的意思?请把上面使用的净空也照得更亮一些。非常感谢您在这里提供的意见。

推荐答案

可以这样看。

假设您有一个左浮动元素。我们称它为挡路F。挡路被浮点数从流中取出,所以下一个挡路元素(假设它不是浮动的,称为挡路B)在水平和垂直方向上与挡路F完全相同的位置开始。当文本放置在挡路B中时,它开始填满挡路B,但文本不会与挡路F重叠。这就是浮点数的作用。

还假设有另一个挡路元素,也不是浮动的,称为挡路C。(这将是我们的重要一项)。挡路C将放置在挡路B的正下方。这可能始于挡路F底部上方或下方,具体取决于区块F和B的相对高度。

--停在这里,确保您的脑海中已经清晰地看到了F、B、C三个区块的两幅可能的图片--

现在,假设我们将clear:left应用于挡路C。如果挡路C开始于挡路F的底部以下,则clear:left无效并且没有清除。

如果挡路C从挡路F的底部上方开始,则挡路C会向下移动,直到其起点不再高于挡路F的底部。移动的距离称为净空

[上面的描述被略加掩饰。挡路的"开始"是页边距框、边框、填充框还是内容框的内边缘还是外边缘?"顶部"和"底部"也是如此。我们在这里不需要担心这一点,但是CSS规范明确了这一点。]

一旦确定了净空与否,就可以机械地应用边际折叠时可能发生的行为。

所以,要回答您的评论问题,只有在应用了除"无"之外的其他明确属性时才能进行清除,但这还不够,挡路实际上必须下移。因此,如果挡路C实际上被clear:left规则下移,则引用的保证金折叠规则仅适用于挡路C。

最后,请注意,由于历史原因,有时可以通过HTML属性间接应用明确规则,而不是直接在CSS中应用。

这篇关于CSS中的Clearance到底是什么的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持编程学习网!

本站部分内容来源互联网,如果有图片或者内容侵犯您的权益请联系我们删除!

相关文档推荐

wkhtmltopdf print-media-type uses @media print ONLY and ignores the rest(Wkhtmltopdf print-media-type仅使用@media print,而忽略其余内容)
Minify CSS with Node-sass(使用Node-Sass缩小CSS)
How to rotate outer div not inner content(如何旋转外部div而不是内部内容)
how to apply css transform to child on parent hover(如何对父级悬停时的子级应用CSS变换)
Only transition a transform in css?(是否仅在css中转换转换?)
CSS transform doesn#39;t change CSS layout(Css转换不会更改css布局)