css 找到图像但无法将它们加载到预览中答案

【问题标题】：css finds the images but cant load them up into a previewcss 找到图像但无法将它们加载到预览中
【发布时间】：2013-09-03 16:58:04
【问题描述】：

我将样式表链接到我的基本 html 文件。

 <title> <link rel="stylesheet" type="text/css" href="style.css">

当我单击转到链接时，它会转到正确的文件。我可以更改背景颜色和所有其他边距。但是当我插入一个 url 时，css 似乎找到了图片，但没有加载到 html，如果我点击预览，则没有加载图片。

 picture {
 width: 984px;
 height: 148px;
 background-image:url(img/header.jpg/);

【问题讨论】：

什么是图片？班级或身份证？
如果您提供 HTML 代码和项目的文件夹结构会有所帮助。无论如何，您可能在“img/header.jpg/”中有错字。尝试删除结尾多余的斜线。
您的 CSS 文件是否在“css”子目录中？然后您必须将 URL 指定为 ../img/header.jpg，因为它必须与 CSS 文件相关。当然还有之前的另外两个 cmets。
不是错字。 css 文件与 html 文件位于同一地图中
它不是 css 文件，因为如果我将鼠标悬停在 url(img/header/jpg) 上，我可以看到图片。

标签： java jquery html css image

【解决方案1】：

在标题标签而不是标题标签下链接您的CSS，因为标题标签是指网站标题。

<header>
    <title></title>
    <link rel="stylesheet" type="text/css" href="style.css">
</header>

和cmets中提到的错别字，并确保你的目的地是正确的。]

p/s（错字）

picture{
    background-image:url(img/header.jpg);
}

【讨论】：

它真的很奇怪，因为我可以改变 div 的背景颜色，但我不能把图片放进去。
现在只加载那张图片。它更好，但你能解释一下错字在哪里吗？
#leftcol_bottom { 背景图片: url(/img/leftcol_bottom.png);背景重复：不重复；宽度：220px；高度：13px；边距底部：13px；这是一个错字。现在那张图片加载了。但其余的没有..这只是链接 div 的另一个示例。这个也有问题吗，因为如果我将鼠标悬停在它上面，这个甚至没有链接到图像。
错字是 header.jpg 后面的“/”。 header.jpg 应该是你的文件类型，所以后面的“/”会损坏文件名类型。 “/”通常用于验证文件夹。对所有 div 进行所有更改，您应该可以显示所有图片。

【解决方案2】：

像下面这样的代码paste在你的html

HTML

<!DOCTYPE html>
<html lang="en">
<head>
<title>TEST</title>
<meta charset="utf-8">
<link rel="stylesheet" type="text/css" href="etbplaza.nl/css/style_basic.css"; />
</head>
<body>
<div class="picture"> your code hre </div>
</body>
</html>

CSS

.picture {
 width: 984px;
 height: 148px;
 background-image:url(img/header.jpg/);

【讨论】：

为什么要将 html 链接到网站？
我使用 localhost 所以正确的路由是 /root/formaten/style.css

【解决方案3】：

这可能是一个错字：

picture {
 width: 984px;
 height: 148px;
 background-image:url(img/header.jpg/);

图片没有可能导致问题的类或 id 选择器和/或可能尝试在引号内使用url('img/header.jpg');。或url('../img/header.jpg')，但我们不知道图片在哪里。

也试试这个：

检查元素
将鼠标悬停在路径上，如果是，则查看路径是否正在加载你的图片会显示在那里

See this technique

【讨论】：

【解决方案4】：

将background-image:url(img/header.jpg/); 更改为background-image:url(img/header.jpg); 还要确保/path/to/file 是正确的，如果图片是一个div 类，那么它会像你的css 中的.picture 一样

【讨论】：

【解决方案5】：

you have to use the css as in the form of class or id and try the code as

.picture {
 width: 984px;
 height: 148px;
 background-image:url(img/header.jpg);
}

or as id 

#picture {
 width: 984px;
 height: 148px;
 background-image:url(img/header.jpg);
}

surly you got the preview of the Image to your HTML page. 
Please check the path of css file is correct or not.

【讨论】：