HTML未从本地CSS文件中拾取背景_Html_Css

HTML未从本地CSS文件中拾取背景

html css

HTML未从本地CSS文件中拾取背景,html,css,Html,Css,我刚刚开始从我的电脑上本地建立一个网站。HTML代码和从我创建的.css文件中选择样式，但是，它不会选择背景图像。请参阅下面我的代码： <!DOCTYPE html> <html> <head> <link rel="stylesheet" href="C:\Users\myUser\Documents\website\style.css"/> </head> <body> <div class="jumbotron"

我刚刚开始从我的电脑上本地建立一个网站。HTML代码和从我创建的.css文件中选择样式，但是，它不会选择背景图像。请参阅下面我的代码：

<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="C:\Users\myUser\Documents\website\style.css"/>
</head>
<body>
<div class="jumbotron">
    <div class="container">
           <h1>Enter</h1>
        </div>
    </div>

</body>
</html>

文本对齐和边距可以很好地工作，但是，无论我使用哪一种，背景图像或背景都无法工作。当我在chrome浏览器中拖动我的页面时，它不会拾取或显示它。正如你所看到的，我指的是图像所在的正确位置，这里没有任何可能的错误。请帮助。

将其更改为此

background-image: url("C:\Users\gonluis\Documents\website\Images\mainbckgrnd.jpg");

此外，请确保这是图像的实际位置

或者更好的是，使用相对路径

/website
    index.html
    style.css
    /Images
        mainbckgrnd.jpg

将代码更改为此

background-image: url("Images\mainbckgrnd.jpg");

我还注意到您正在将此图像添加到body标记。确保身体是真实可见的，这样做可以看到图像

html, body {
    width:100%;
    height:100%;
}

换成这个

background-image: url("C:\Users\gonluis\Documents\website\Images\mainbckgrnd.jpg");

此外，请确保这是图像的实际位置

或者更好的是，使用相对路径

/website
    index.html
    style.css
    /Images
        mainbckgrnd.jpg

将代码更改为此

background-image: url("Images\mainbckgrnd.jpg");

我还注意到您正在将此图像添加到body标记。确保身体是真实可见的，这样做可以看到图像

html, body {
    width:100%;
    height:100%;
}

正如你所见，我指的是图像所在的正确位置，我们不知道你的图像存储在哪里。另外，Chrome开发者工具中的网络点击按F12会说什么？404？将图像与其他文件放在同一文件夹中，然后使用相对路径。您是否在当前计算机上托管您的网页？如果没有，最简单的解决方案是将图像上载到与.html文件相同的服务器上，并从那里链接它。EDIT，刚看到本地PC。嗯，这正是图像所在的位置，在我的C:\中，在我添加的路径中，Chrome开发工具中的网络标签上写着：net:：ERR_FILE_NOT_found如果你不使用XHTML，你不需要一个关闭标签，因为你可以看到我指向了图像的正确位置，我们不知道你的图像存储在哪里。另外，Chrome开发者工具中的网络点击按F12会说什么？404？将图像与其他文件放在同一文件夹中，然后使用相对路径。您是否在当前计算机上托管您的网页？如果没有，最简单的解决方案是将图像上载到与.html文件相同的服务器上，并从那里链接它。EDIT，刚看到本地PC。嗯，这正是图像所在的位置，在我的C:\中，在我添加的路径中，Chrome开发工具中的网络标签上写着：net:：ERR_FILE_NOT_found如果你不使用XHTML，你不需要一个关闭标签来确认。当我将背景图像放在与案例中index.html root.html相同的文件夹中时，它会显示出来。所以我把你的作为答案，但是，这不适用于其他文件夹的原因是什么，因为我可能希望在我的网站中包含许多图像，但将它们组织在不同的文件夹中，而不是将它们分散在索引所在的同一文件夹中。htmlYou不应该使用绝对路径。当你把这个网站上传到服务器或者移动主目录时，所有的链接都会被破坏。您应该拥有相对于主目录的路径。您应该能够在您的网站文件夹中创建一个名为images的文件夹，然后将所有图像放在该文件夹中。然后使用images/my-image.jpgOk的相对路径访问它们。当我将背景图像放在与案例中index.html root.html相同的文件夹中时，它会显示出来。所以我把你的作为答案，但是，这不适用于其他文件夹的原因是什么，因为我可能希望在我的网站中包含许多图像，但将它们组织在不同的文件夹中，而不是将它们分散在索引所在的同一文件夹中。htmlYou不应该使用绝对路径。当你把这个网站上传到服务器或者移动主目录时，所有的链接都会被破坏。您应该拥有相对于主目录的路径。您应该能够在您的网站文件夹中创建一个名为images的文件夹，然后将所有图像放在该文件夹中。然后使用images/my-image.jpg的相对路径访问它们