个人中心
gpt4 book ai didi

html - 正文背景图片未填满页面

转载 作者：太空宇宙 更新时间：2023-11-04 14:22:48 25 4
gpt4 key购买 nike

我不确定发生了什么，因为没有更改 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(){ //你的代码设置 lefftbar 的位置

      }
    </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;
    }

最佳答案

在你的body你应该添加的类 background-size: cover;这样它就覆盖了整个<body>

关于html - 正文背景图片未填满页面，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/19779623/

25 4 0
文章推荐： css - 使用 CSS 删除重复出现的点
文章推荐： c++ - 关闭 Internet Explorer 的所有实例
文章推荐： c++ - 在类中使用动态数组——在编译时接收错误
文章推荐： css float 元素不包含在父div中
太空宇宙
个人简介

我是一名优秀的程序员,十分优秀！

滴滴打车优惠券免费领取
滴滴打车优惠券
全站热门文章
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com