1

在标准的 Magento 样式表中，有大量的 css 类，然后是

{
    clear: both;
    content:".";
    display: block;
    font-size: 0;
    height: 0;
    line-height: 0;
    overflow: hidden;
}

为了测试它的作用，我删除了这一行，并在至少一个块上将所有内容向上移动了大约 300 像素，并允许到处浮动。这是我只删除内容的时候：“。” 线。它几乎看起来像是在充当 display:block 或 clear:both - 或与它们一起工作。

我不知道它做了什么 - 有人可以启发我。

4

1 回答 1

4

这种风格的块被称为clear fix。当页面中的包含元素（例如 div）仅包含浮动元素时，它将折叠，因为浮动元素已从页面流中删除。这将导致包含元素失去其高度。

clear 修复的作用是插入一个无意义的内容，在大多数情况下是一个点，使用 CSS 伪类:after并通过将高度设置为 0 来隐藏。这将强制包含元素自行清除，它不会松开它的高度。

在此处阅读有关它的更多信息： css-tricks clear fix 解释

于 2012-07-26T04:37:24.000 回答