消失的要点

Question

http://biochrom.fivesite.co.uk/catalogue4.asp

在上面的页面上有一个浮动到左侧的图像。在它的右边是一个标题为“特征”的列表。列表项具有背景图像，但是没有出现。清单2显示了背景图像的外观。

有谁知道如何让子弹可见？

Answer 1

您的图片有一个浮动：左侧属性。因此，列表项被“后面”呈现。图像。

margin-left:200px;

UL元素上的

将解决您的问题。

或者，您可以在UL元素上应用float：left。这将使其浮动到图像，但会使以下内容出现在同一行。您可以通过清除UL元素或在UL元素之后添加元素来防止这种情况发生...

clear:both

......适用于它。

有关此行为的更多信息，请访问 http://www.positioniseverything.net/easyclearing。 HTML 。

Answer 2

我知道这是一年前的帖子，但其他人可能想知道...

如果您使用的是内容管理系统，而某些网页上有图片和图片，会发生什么？有些人不希望你的列表项在内容中是200px吗？

您可以将此CSS添加到您的UL / OL元素：

overflow:hidden;

我希望有所帮助。

Answer 3

这个帖子确实很老，但总是相关的......

另一种替代解决方案：

display: inline-block;

将此放在UL 上。它强制整个ul出现在浮动之后。这样你可以有一个带或不带图像的页面，它将始终正确显示（在FF4，IE7和8，Chrome 11上查看）。

Answer 4

或者，您可以使用list-style-image属性而不是background-image。前几天我遇到了这个问题：浮动在他们的'邻居'上展示的文本包装行为仅适用于'内容'，而不适用于背景图像（例如）。