正文背景图像未填满页面答案

【问题标题】：body background image doesn't fill the page正文背景图像未填满页面
【发布时间】：2013-11-05 00:01:27
【问题描述】：

我不确定发生了什么，因为没有更改 CSS，但突然我的背景图片停在页面顶部，无论我更改什么都不会继续到底部

这里是 HTML

    <!DOCTYPE html>
    <html lang="en">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>Just Joel</title>
    <link href="../CSS/JJ.css" rel="stylesheet" type="text/css" />
    <link href="../CSS/grogrotesque.css" rel="stylesheet" type="text/css">
    <link href="../CSS/stylesheet.css" rel="stylesheet" type="text/css">

   <meta charset="utf-8" />

<script type="text/javascript" src="../js/jquery-1.4.3.js"></script>
   <script type="text/javascript" src="../js/jquery.corner.js"></script>
<script type='text/javascript' src="../js/slideshow.js"></script>


   <link rel="stylesheet" href="../London Food Therapy/css/style.css" type="text/css" media="screen" />
<style type="text/css">
@import url("../../../CSS/JJ.css");
</style>
    </head>

    <body>

<div id="wrapperfull">

    <div id="header">
    <a href="../London Food Therapy/index.html"><img src="../../../Images/Header.png" width="379" height="99" alt="Just Joel Header"></a>
    </div><!-- end header div -->

    <div class="navigation">
    <nav>
    <ul>
    <li><a href="../../index.html">HOME</a></li>
    <li><a href="../../about.html">ABOUT</a></li>
    <li><a href='#'><span>WORK</span></a>
    <ul>
    <li class="services1">
    <a href="../../print.html">PRINT</a>
    <a href="../../branding.html">BRANDING</a>
    <a href="../../editorial.html">EDITORIAL</a>
    <a href="../../photography.html">PHOTOGRAPHY</a>
    </li>
    </ul>
    </li>
    <li><a href="../../blog.html">BLOG</a></li>
    <li><a href="../../inspired.html">INSPIRED</a></li>
    <li><a href="../../contact.html">CONTACT</a></li></ul>
    </nav>
    </div><!-- end navigation div -->

    <div class="blog-container">
    <div id="sidebarwrapper">

<div id="sidebar">

<div class="arrow right"><a href="../London Food Therapy/index.html"></a></div><div class="arrow"><a href="../London Food Therapy/Just Joel home.html"></a></div>

        <h1>DENTAL PERFECTION</h1>
        <br>
  <p>Tree Top News is a publcation produced through Highgate Woods, a heritage woodland in London</p>

  <p>I produced the publication two years running, capturing the amazing nature and wildlife around he wood. I was responsible for rt direction, design and print.</p>

    <script>
       $(window).scroll(function(){  

    if($(window).scrollTop() + $(window).height() >= $(document).height() - 200){
        setLeftBarPosition();
    }
        });

函数 setLeftBarPosition(){ // 你的代码来设置leftbar的位置

      }
    </script>

    </div><!--sidebar!-->
    </div>


<div class="project">
        <img src="../../../Images/Dental/Dental5.jpg" alt="Kookielogo" class="image" height="378" width="580">
        <img src="../../../Images/Dental/Dental4.jpg" alt="Tree Top" class="image" height="378" width="580">
        <img src="../../../Images/Dental/Dental2.jpg" alt="Tree Top" class="image" height="378" width="580">
        <img src="../../../Images/Canons high/Canons5.jpg" alt="Tree Top" class="image" height="378" width="580">
        <img src="../../../Images/Canons high/Canons6.jpg" alt="LFT" class="image" height="378" width="580">

    <div class="clear"></div>

    </div>

    </div>


    </div>

    </div>

    </body>
    </html>

CSS

    html{
margin: 0;
padding: 0;
border: none;
height: 100%;
    }

    body {
margin: 0;
padding: 0;
border: none;    
height: 100%;
background-image: url(../Images/Lines%20background.jpg);
background-repeat: repeat;
background-attachment: fixed;
    }

【问题讨论】：

可能使用background-size？也许this question 也会有所帮助。

标签： html css background repeat

【解决方案1】：

在您的 body 类中，您应该添加 background-size: cover; 以便它覆盖整个 <body>

【讨论】：

所做的只是进一步压缩背景图像，我想不出突然间会发生什么
它在dreamweaver中显示很好，但是当我上网时它就停止了
这是我目前的网站，我看不到图片是如何停在背景上的 user48140.vs.easily.co.uk