图像作为 HTML <img> 可以正常工作，但不能在 CSS background-image 上工作我错过了什么？答案

【问题标题】：Image works fine as a HTML <img> but not on CSS background-image What I'm I missing?图像作为 HTML <img> 可以正常工作，但不能在 CSS background-image 上工作我错过了什么？
【发布时间】：2017-12-01 06:09:07
【问题描述】：

我对网络开发（自学）有点陌生，我似乎无法克服学习如何在 CSS 上添加背景图像的困难。

我在 HTML 上添加了一个图像，它在网络浏览器上显示良好，但是当我尝试添加与背景图像相同的图像时，它不起作用。我确定我错过了一些简单的东西，但到目前为止我无法弄清楚。这是代码

这是我的 HTML img 代码，运行良好

<div class="pic"
<img src="C:\Users\omar\Pictures/applelogoretro.jpg.jpg" atl="happy"
style="width:85%; height:75%;"/>
</div>

背景图片 HTML

<div class="backpic">
<p>This is the TEXT on my BackGround image</p>
</div>

CSS

.backpic{
background-image: url"C:\Users\omar\Pictures/applelogoretro.jpg.jpg";
}

为什么图像作为常规图像可以正常工作，但不能作为背景图像。您的回答越详细，对我的帮助就越大，在此先感谢大家！

【问题讨论】：

你不应该为你的图片使用本地绝对路径。请改用相对路径。此外，CSS background-image 的语法不正确。不要编造自己的语法。
正如 Raptor 所指出的，查找相对路径是什么，它们将为您节省大量工作。

标签： html css image

【解决方案1】：

可以尝试检查语法，看看是否会这样做？

background-image: url("pathtoyourimage.jpg");

【讨论】：

【解决方案2】：

css中的url应该在括号内：

所以这一行 background-image: url"C:\Users\omar\Pictures/applelogoretro.jpg.jpg";

应该是background-image: url("C:\Users\omar\Pictures/applelogoretro.jpg.jpg");

正如@Raptor 和@YAHsaves 指出的，你应该使用相对路径

【讨论】：

【解决方案3】：

尝试检查语法错误（>），看看它是否会这样做

.pic{背景图片：网址（ggg.jpg）；背景重复：不重复； }

【讨论】：