简体   繁体   English

无法将图像作为 css 的背景

[英]Can't put an image as background on css

I've been trying to put an image as background, but for some reason, it doesn't work.我一直在尝试将图像作为背景,但由于某种原因,它不起作用。

Below you will find my HTML and CSS .您将在下面找到我的HTMLCSS The name of the image is Background and its size is 1280*720 .图片名称为Background ,大小为1280*720

The HTML : HTML

<!DOCTYPE html>
    <html>
      <head>
              <title></title>
              <link rel="stylesheet" type="text/css" href="test.css">


        </head>
        <body >

            <header>

            </header>






            <footer></footer> 

        </body>      

    </html>

The CSS : CSS

body {
background: url("C:\Users\pro tech\Desktop\site web\Nouveau dossier: background.jpeg") no-repeat;

background-size: cover;
}  

The image url should be relative to your css file and not your desktop.图像 url 应该与您的 css 文件相关,而不是您的桌面。 Or in your case relative to the html file because you have inline css.或者在您的情况下,相对于 html 文件,因为您有内联 css。

The url is way off. url 很遥远。

It should be something like...它应该是这样的......

background: url("/images/background.jpeg")背景:url(“/images/background.jpeg”)

The url of the background image needs to begin where that CSS file is located.背景图像的 url 需要从 CSS 文件所在的位置开始。 If you need to go back a folder, you use ../ , which leads me to my next thing: make sure you are using forward slashes and not back slashes.如果您需要 go 回一个文件夹,请使用../ ,这使我想到了下一件事:确保您使用的是正斜杠而不是反斜杠。

Example: If you have your CSS file on your desktop right now, your path would look like this: url("site%20web/Nouveau%20dossier/background.jpeg");示例:如果您的桌面上现在有 CSS 文件,您的路径将如下所示: url("site%20web/Nouveau%20dossier/background.jpeg");

maybe because there is blank space on the url link?可能是因为 url 链接上有空格? try to replace the blank url with %20尝试用 %20 替换空白 url

body {
background: url("C:\Users\pro%20tech\Desktop\site%20web\Nouveau dossier\background.jpeg") no-repeat;

background-size: cover;
} 

or just remove the detail URL, and just use image file name if the image is in the same folder as html and css或仅删除详细信息 URL,如果图像与 html 和 css 位于同一文件夹中,则仅使用图像文件名

body {
background: url("background.jpeg") no-repeat;

background-size: cover;
} 

You need to add some height or content to the body.您需要为正文添加一些高度或内容。 for now height is 0px so background image is not showing现在高度是 0px 所以背景图片没有显示

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM