1

在寻找这个问题的解决方案时，我尝试在:after伪类中添加一个清除元素。它做了我想要的，但不是出于我预期的原因 - 在缩小范围后，我发现定义以下内容可以清除元素：

.right_field > div:after
{
    content: "style=\"foo\"";
}

我希望它做的是将文本附加到内元素style="foo"的末尾，但它不会添加任何视觉内容并清除元素，以便它们环绕它们的浮动子元素。div.right_field

请参阅以下小提琴进行演示。尝试foo从 content 属性中删除 ，看看它如何不再清除元素，而是将文本附加到每个元素。 http://jsfiddle.net/dNJxd/5/

为什么会发生这种情况，这是一个值得信赖的功能吗？我在 Chrome、Firefox 和 IE7-9 上对其进行了测试，它们都以相同的方式工作。

4

1 回答 1

1

您的示例确实在元素style="foo"之后附加了文本。div唯一不会这样做的浏览器（从您的测试浏览器列表中）是 IE7，因为它不支持::after伪类。

也许您需要进一步扩展您的JSFiddle 结果窗口。

此外，这不会清除浮动 - 它只是给父 div 一些高度，因为附加的文本没有浮动。当内容的div高度大于附加文本时，仍然会发生边框折叠。

于 2012-05-15T10:41:04.520 回答