为什么clearfix只能在浮动元素上工作？

浮动和绝对定位的元素都从文档流中取出。那么为什么clearfix只能在浮动元素上工作，而不是在绝对定位的元素上工作？为什么clearfix只能在浮动元素上工作？

来源

2016-05-13 user31782

它更像是css清除属性，仅用于清除浮动块 –

@DhavalChheda [clearfix]（https://css-tricks.com/snippets/css/clear-fix/）是_not_ css属性。这是一种破解。 – user31782

是的，但是clearfix使用了clear属性。清晰的属性只影响浮标 - 因为只有浮标可以清除。定位元素没有这种“清除”的概念。 – BoltClock

FLOAT：当你漂浮的元素，该元素不取出。 Float不会从文档的流中移除元素。

位置ABSOLUTE：当位置的元素的元素是取出（上述其它元件放置）。绝对定位从文档流中移除一个元素。给定绝对定位的元素将不再影响文档中其他元素的布局。

这是你可以很容易地理解一个最好的例子：Check this

来源

2016-05-13 09:48:05

w3.org官方教程说_A浮动框被取出**文档流... **参考：第3段https://www.w3.org/wiki/Floats_and_clearing#How_does_floating_work.3F – user31782

对不起，对于浮动元素的误解。 –

有漂浮从文档流中除去永久一种常见的误解。

这不是的情况下，浮动元件由在流其标准位置移开并尽可能移动到左侧或右侧上的电流线，根据指定的浮动方向。

W3 Spec

浮子是一个盒子是移位到左边或右边在当前行。浮动（或“浮动”或“浮动”框）最有趣的特征是内容可能沿着其侧面流动（或者被“清除”属性禁止这样做）。内容沿着左浮动框的右侧向下流动，并沿右浮动框的左侧向下流动。

将浮动框向左或向右移动，直到其外边缘接触包含块边缘或另一个浮动块的外边缘。如果存在线框，浮动框的外部顶部与当前线框的顶部对齐。

浮动元素影响他们周围的元素，绝对定位元素不会。

上绝对定位

在绝对定位模型W3 Spec，箱被明确地相对于它的包含块的偏移量。 它完全从正常流程中移除（它对后来的兄弟姐妹没有影响）。

注意区别？

所以一个clearfix（或间隙）只影响浮动元素。甲clearfix不用于清楚浮动的元件，它用来包含另一元件的内部浮动元件。

有一篇关于CSS-Tricks的文章，它解释了All About Floats，并且介绍了它们和定位之间的区别。

来源

2016-05-13 11:44:41

_Content沿着左浮动框的右侧向下流动，并沿右浮动框的左侧向下流动._ _Content_是否仅表示文本和图像？ – user31782

是......如果可以的话。 - http://learnlayout.com/float.html –

它与内容的显示类型有关吗？例如。在浮动元素和块级元素周围是否只有'inline'元素流将它们视为绝对位置元素？ – user31782

为什么clearfix只能在浮动元素上工作？

回答

相关问题