背景图片不显示在span标记中 [英] Background image not showing up in span tag
问题描述
我有一个span标记显示在Windows 7上的最新的FF中的背景图像的麻烦。
似乎工作,并显示一切正常在早期的FF,Chrome,Safari和IE,但手持设备和Windows 7似乎失败。
Im having trouble with a span tag showing a background image in the latest FF on windows 7. It seems to work and show everything fine in earlier FF, Chrome, Safari and IE but handheld devices and windows 7 it seems to fail.
对不起,如果这似乎模糊我只是无法想出来,图像最初的pngs没有高度指定和ive,因为他们gifs和应用的高度。
Sorry if this seems vague I just cant figure it out, the images were originally pngs with no height specified and ive since made them gifs and applied a height.
<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>
推荐答案
background-image CSS属性只将图像的背景。对象的宽度和高度始终通过CSS /内嵌样式的静态设置或其中显示的内容的实际大小来定义。
在你的情况下,由于你没有在你的标签之间添加任何内容,它的x / y维度将为0,但没有背景的错误。它在那里,只有你不能看到它,除非你定义(不知何故)的元素的大小。
The background-image CSS property only puts an image as the background. The width and height of an object is always defined either by static settings via CSS/inline styling, or by the actual size of the content displayed in it. In your case, since you haven't added any content between your tags, its x/y dimensions will be 0, but there is no bug with the background. It's there, only you can't see it unless you define (somehow) a size for the element.
<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可以是任何有用的值适合您的情况。
Where 50 can be any helpful value suited for your case.
这篇关于背景图片不显示在span标记中的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!