html - 无法弄清楚如何将背景图像放入我的 <div> 工作正常

标签 html css web

我现在只是在学习基础知识。我正在学习 Udemy 类(class),但图像根本不显示。

<!doctype html>
<html>

    <head>
        <title>CSS Basics</title>
        <meta charset="utf-8" />
        <meta http-equiv="Content-type" content="text/html; charset=utf-8" />
        <meta name="viewport" content="width=device-width, initial-scale=1" />
        <style>
            #main {
                width:800px;
                height:1000;
                margin-left: auto;
                margin-right: auto;
                background-color: #82b3ae;
                padding:20;
            }
            h1 {
                text-align: center;
                color: green;
                font-size: 50;
            }
            #jumbotron {
                background-image: url('../assets/banner.jpg'); 
                height: 200px;
                width: 800px;
            }
        </style>
    </head>

    <body>
        <div id="main">
            <div id="jumbotron">
                 <h1>Neil Harper's Website</h1>
            </div>
            <p>Lorem ipsum dolor sit amet, eros elit recteque ex pri, mei iusto oratio te. Duo equidem dolorum antiopam ea. Munere electram suavitate has an. An mei ornatus sensibus eleifend. Vero tritani pro id.</p>
            <p>Ut quo esse porro honestatis, vis ad nisl vidit, id assum voluptaria his. Eos ei tibique vituperata, ridens mentitum persequeris mei in. Habeo doctus partiendo eu nam, dicant appetere vim ex, quo et esse regione. Pri habeo soleat commune cu.
                Ei possit prompta commune vim, cu latine nostrum vix.</p>
        </div>
    </body>

</html>

最佳答案

尝试将 background-size: 100%; 添加到 #jumbotron

关于html - 无法弄清楚如何将背景图像放入我的 <div> 工作正常,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/29351788/

相关文章:

html - 为什么 div 100% 宽度不能按预期工作

c# - 使用 Selenium 选择元标记

PHP/MySQL 多列排序

html - 当我打开 html 文件时,我的按钮不起作用,但在 CODEPEN 上它起作用了?

html - 导航栏事件元素在悬停时不应该改变颜色?

javascript - 在 AngularJS 中为每个第 n 个元素自定义 ng-repeat

javascript - 如何在 React 鼠标位置渲染一段自毁段落?

CSS LESS - 在循环中添加变量

internet-explorer - Internet Explorer 10 "This page cannot be displayed"加载我的网站时

javascript - Canvas:返回到绘制前的状态