Question

这是我正在使用的一个例子。 http://jsfiddle.net/5J4PE/

我希望红色和贪婪的盒子紧紧地显示在文本周围（就像使用内联块时一样）。

但是，我希望它占用空间，就像使用块一样，这样盒子就会堆叠而不是排成一行。

我不希望它们的宽度相同，所以我不想使用table-cell或任何表格显示。

我可以在元素之间添加<br/>，但我想知道是否有办法在CSS中执行此操作。

Answer 1

你可以在文字和文本周围使用然后在css中设置bg Color

<div><span class="red">hello</span></div>

然后另外你可以使用外部div上的任何样式。

Answer 2

它与<br />标签一样令人讨厌，但所有元素上的float: left; clear: left;都可以获得您想要的效果。选择你的毒药？

显然你会丢失一些浮动的布局流程，所以你需要调整你的父级来解释它。

Answer 3

您是否尝试过使用before:或after:伪类？这些允许您使用CSS在块之前或之后添加内容。

例如<span>Hello</span>使用span:after {content:" world";}设置样式会在浏览器中生成Hello world。

如果您指定了换行符，则应在块的末尾添加一个空行。注意：您需要使用换行符的unicode值指定它。

希望有所帮助。