Question

我有一个可变数量的段落，我想在它们之间散布图像。我不能在代码本身中穿插它们。这些段落是作为一个块给我的。

我在这里创建了一个jsfiddle：http://jsfiddle.net/4VvVL/1/，但我不确定如何做到这一点。我不能这样做：

<img>
<p>...</p><p>...</p>
<img>
<p>...</p><p>...</p>
<img>
<p>...</p><p>...</p>

但必须将段落保留在一个块中：

<img><img><img>
<p>...</p><p>...</p><p>...</p><p>...</p><p>...</p><p>...</p>

有什么想法？我可以用代码（js或其他）来做，但我想知道是否有CSS解决方案。

Answer 1

如果您不关心它们实际上是img标签，并且您不关心旧浏览器，那么就可以完成。请参阅http://jsfiddle.net/4VvVL/10/和http://jsfiddle.net/4VvVL/9/。

这是否比javascript更实用可能有问题，但这是由你来决定的。

我们的想法是使用:before伪元素为背景图像创建一个展示位置，然后使用:first-child作为基础从相邻的兄弟选择器“计数”。对于支持它的浏览器，:nth-child选择器甚至更好。见http://jsfiddle.net/4VvVL/11/。