Question

我在这里遇到一个奇怪的问题。我的全屏背景图片完美配合在线图片网址但不是它位于图片文件夹（此处名称为：img）中，而且必须是。

此网站有一个“img”文件夹，里面有bkg.png图片。

我还将图像放在根文件夹中，以防万一以下url（bkg.png）;但它也没有用。所以最后我将图像发布在flickr上并且它正在工作。但我需要了解问题并将其放在我的img文件夹中。

感谢您的帮助。

科琳娜。

 /*into folder : root/css/mob_pss.css */
      
      * {
       margin: 0;
       padding; 0;
       font-family: 'Lato', sans-serif;
       font-size: 14px;
      }   

      *::after, *::before {
       -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
       box-sizing: border-box;
      }
      
      /*into folder : root/css/mob_bkg.css */
      
      html {
       /*I've tried those*/
        
       /*background-image: url(css/bkg.png);*/
       /*background-image: url(bkg.png);*/
        
       /*they didn't work*/
        
       /*but this works*/
       background-image: url(http://wallpaperwarrior.com/wp-content/uploads/2016/09/Wallpaper-14.jpg);
       background-position: center center;
       background-repeat: no-repeat;
       background-attachment: fixed;
       background-size: cover;
       background-clip: border-box;
       background-color: #464646;
      }

      @media only screen and (max-width: 767px) {
       html {
         
       /*I've tried the following*/
         
       /*background-image: url(css/bkg.png);*/
       /*background-image: url(bkg.png);*/
         
       /*they didn't work*/
         
       /*but this works*/
         
       background-image:vb url(http://wallpaperwarrior.com/wp-content/uploads/2016/09/Wallpaper-14.jpg);

       }
      }
      body {
       background-color: transparent;
      }

<!DOCTYPE html>
<html lang=""> <!--language here-->

<head>
   <!--DEVICE MATTERS-->
   <meta charset="UTF-8">
   <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
   <meta name="viewport" content="width=device-width, initial-scale=1.0">
   <title>FULL SCREEN BACKGROUND</title>
   <link href="css/mob_bkg.css" rel="stylesheet">
   <link href="css/mob_pss.css" rel="stylesheet">
   <style></style>
</head>
<body>
<!---->  
</body>
</html>

Answer 1

下面考虑你的结构

index.html 
css 
-- style.css 
img 
-- pic1.jpg

如果你在style.css档案中写下你的css

所以我会写下style.css

中的代码

body{
    background: url(../img/pic1.jpg);
}

CSS中的

url()与您的css文件的位置相关

Answer 2

检查图像的路径是否正确？

Answer 3

尝试使用单引号，

   background-image: url('css/bkg.png');
   background-image: url('bkg.png');

只有在线网址时，background-image才能使用“img”文件夹中的图片

3 个答案: