Question

我有一个问题，在CSS中我包含了一个图像作为背景，但它加载或只显示一半的尺寸......

我的代码：

CSS：

html, body { 
margin: 0; 
padding: 0; 
} 

#background
{ background-image: url("../img/background.png"); }

HTML：

<body>
    <div id="background">
        <div class="container">
             <?php include("template/navigation.php"); ?> 

                <?php
                if(isset($_GET["page"])) $page = $_GET["page"];
                    else $page = "home";
                if(file_exists('pages/'.$page.'.php'))
                    include('pages/'.$page.'.php');
                else include("pages/home.php");
                ?>
            </div>         
    </div>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
    <script src="assets/js/bootstrap.min.js"></script>
</body>

我尝试更改背景大小，但没有任何反应。如果我使用高度它看起来很糟糕...... 有人可以帮助我吗？

这就是它现在的样子，但我希望Image有全高......

Answer 1

在这种情况下，您需要为您的身体指定背景：

body { background-image: url("../img/background.png"); }

或者，给#background更多高度：

#background{ height: 100vh; background-image: url("../img/background.png");}

它是一个div，它只与它里面的内容一样高。

CSS背景图像加载半角

1 个答案: