背景图片显示不出来

我希望把背景图像从一个类的列表项：背景图片显示不出来

<ul> 
<li> Stuff </li> 
<li> More Stuff </li> 
<li class= "horizdotted" </li> 
</ul>

这里的CSS

.horizdotted { 
background-image: url("images/horizdotted.png"); 
background-repeat:no-repeat;}

这不工作，任何浏览器......看起来我必须在LI中至少有一些信息（除了背景图像）。所以，我做了一个白色像素PNG，并尝试另一种方式：

<ul> 
<li> Stuff </li> 
<li> More Stuff </li> 
<li class= "horizdotted"><img src="images/pixel.png" alt="teeny pixel" /> </li> 
</ul>

相同的CSS。这适用于Chrome和Firefox，但不适用于IE。我不能，对于我的生活，让它在IE中工作。如果可以的话请帮忙！！这是第二种方式的Chrome中的图像（带有小像素）。 [东西，更多的东西在无序列表，虚线] http://www.flickr.com/photos/[email protected]/20892/in/photostream/

来源

2012-12-29 Anne

设置宽度和高度在CSS

.horizdotted { 
    background-image: url("images/horizdotted.png"); 
    background-repeat:no-repeat; 
    width:50px; 
    height:50px; 
}

组根据您的图片大小这个属性，你想要的。

来源

2012-12-29 05:25:02

哦，你真棒！修好了！我仍然不确定为什么我需要宽度和高度，但它工作！ – Anne

jsFiddle for IE

您需要添加内容到你的li使之具有的东西显现。另外，在你的问题中你有一个语法错误。它缺少一个右括号>符号。在等级名称后面也有一个空格。

HTML：

<ul> 
    <li> Stuff </li> 
    <li> More Stuff </li> 
    <li class="horizdotted">Some stuff to view background.</li> 
</ul>

CSS：

.horizdotted { 
    background-image:url(http://placehold.it/500x17/00ff00); 
    background-repeat: no-repeat; 
}

jsFiddle for IE: No CSS

而且，由于它只是你要显示的虚线，则没有CSS是必要的：

HTML：

<ul> 
    <li> Stuff </li> 
    <li> More Stuff </li> 
    <li>-----------------</li> 
</ul>

来源

2012-12-29 05:34:24 arttronics

在CSS中添加背景图片的宽度和高度可以解决问题。我只想要图像，没有文字或任何东西，所以我添加了一点白色像素......它解决了除IE以外的所有浏览器中的问题。然后当我添加宽度和高度时，我不再需要即使是小像素。现在li类只有

，里面什么都没有......而且它在浏览器中可以正常显示。好极了！谢谢你的帮助！ – Anne

背景图片显示不出来

回答

相关问题