背景图片没有在span标签中显示

我在windows 7上最新的FF中显示背景图片的span标签有问题。它似乎在早期的FF，Chrome，Safari和IE中可以正常工作并显示一切，但手持设备设备和Windows 7似乎失败了。背景图片没有在span标签中显示

对不起，如果这看起来模糊，我只是不能弄明白，图像最初是没有指定高度的png，因为它们使用gif和应用高度。

<span class="design">Design Viz</span> 
<style> 
.design { 
    background:url(_includes/images/agenda-design.gif) no-repeat top left; 
    display: inline-block; 
    height: 17px; 
    padding-left:25px; 
} 
</style>

来源

2011-09-28 Liam

只是一个快速的猜测，但你真的需要有“您的网址”（所以它的URL（” _包括/ images/agenda-design.gif'） – MTilsted

我做过了，我在将它发布到这里作为它的客户端之前已经剥离了它。 – Liam

背景图像的CSS属性只把一个图片作为背景。对象的宽度和高度总是通过CSS /内联样式的静态设置或其中显示的内容的实际大小来定义。就你而言，由于你没有在你的标签之间添加任何内容，它的x/y尺寸将为0，但是背景没有错误。它就在那里，除非您为元素定义（以某种方式）尺寸，否则只有您不能看到它。

<span class="design">Design Viz</span> 
.design { 
padding-left:25px; 
background:url(_includes/images/agenda-design.gif) no-repeat top left; 
display: inline-block; 
height: 17px; 
width: 50px; 
}

其中50可以是任何有用的值适合您的情况。

来源

2011-09-28 11:11:08

我有我的标签之间的内容思想，'设计Viz'？ – Liam

跨度的高度和展示是我一直在努力的关键因素。 – Pupil

-1

添加宽度：知识+你的CSS样式太（或任何宽度是）

来源

2011-09-28 11:04:00 Christian

但是该类适用于所有长度不同的多个单词，所以我不能设置特定的宽度。 .. – Liam

你可以添加最小宽度： – Christian

我试着添加min-widht：17px和width：auto，没有运气 – Liam

display：inline-block;不支持IE7。如果你声明的背景图像

.design { 
    padding-left:25px; 
    background:url(_includes/images/agenda-design.gif) no-repeat top left; 
    display: inline-block; 
    height: 17px; 
    width: 50px; 
    zoom: 1; 
    *display:inline; 
}

来源

2011-09-28 11:18:38 GDW

你不能设置属性no-repeat top left：您可以通过添加修复它。在background-image中，您只能设置指向图片的链接。

或者你可以使用background这样的：

background: url(...) no-repeat top left

来源

2017-01-29 18:06:45

使用填充像

padding-left:25px; 
    padding-top: 6px; 
    padding-bottom: 10px; 
    padding-right: 5px;

来源

2017-12-26 10:44:02

背景图片没有在span标签中显示

回答

相关问题