HTML & CSS - background-image:url不显示
HTML & CSS - background-image:url不显示
提问于 2013-05-20 10:15:30
下面是html，例如：
<td class=topleft width=10 height=10></td>下面是CSS：
td.topleft{
border:0px;
width: 100px;
background-image: url(images/topleft.png);
background-repeat:no-repeat;
}目录结构(从我桌面上一个名为site的文件夹开始)
site.html
styles.css
/images/topleft.png
注意:样式是从css文件中填充的。
我已经尝试了文件的绝对路径：
background-image:url(file:///C:/Users/user/Desktop/site/images/topleft.png);如果我将该url直接放入浏览器中，则可以访问该图像并显示出来。
回答 3
Stack Overflow用户
发布于 2013-05-20 10:28:17
尝试使用此HTML：
<td class="topleft"> </td> <!-- TD not empty, inserting blank space -->还有这个CSS：
td.topleft
{
border: 0px;
width: 100px;
height: 100px;
background-image: url(images/topleft.png);
background-repeat: no-repeat;
}验证图像文件名是否为小写，即使是扩展名也是如此。确认images文件夹也是小写的。它起作用了吗？
Stack Overflow用户
发布于 2013-05-20 10:37:00
试试这个：
background-image: url(./images/topleft.png);
Stack Overflow用户
发布于 2013-05-20 10:38:26
如果您的文件链接和文件路径是正确的，它应该可以正常工作。
示例：http://jsfiddle.net/Vc8f6/
要解决这个问题，你应该试着把CSS放在body标签之前，使用style标签来确保css正常工作。如果您仍然没有看到图像，请检查文件路径、拼写(区分大小写)和扩展名(.png、.jpg等)。
HTML
<table>
<tr>
<td class=topleft width=50 height=50>text goes here</td>
</tr>
</table>CSS
td.topleft{
border:0px;
width: 500px;
height: 150px;
background-image: url(http://www.smiley-faces.org/wallpaper/smiley-face-wallpaper-widescreen-001.jpg);
background-repeat:no-repeat;
}页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/16641623
复制相关文章
相似问题
腾讯云开发者
