html 将图片设置成背景

在网页中，我们常常需要使用图片来增加页面的美观度和表现力。而将图片设置为页面的背景也是一种常见的方式。

style>
body {
    background-image: url("图片路径");
    background-repeat: no-repeat;
    background-size: cover;
}
    /style>
    

以上代码是将一张图片设置为整个页面的背景。首先，我们需要在style标签中编写CSS代码。将背景设置为图片，需要使用background-image属性。将图片的路径放在url()中，即可显示出该图片。随着网页的大小改变，如果我们不希望图片出现重复，可以使用background-repeat属性并设置为no-repeat。

接着，我们要让图片适应整个页面，不会出现留白或拉伸，这也是常用的设置。使用background-size，并设置为cover，图片会完全适应页面，覆盖整个视野。

div class="bg-img">
    h1>
    这是文字/h1>
    /div>
    style>
.bg-img {
    background-image: url("图片路径");
    background-repeat: no-repeat;
    background-size: cover;
    width: 100%;
    height: 300px;
}
    /style>
    

如果我们只希望将图片作为某个区域的背景，可以将图片放在一个div块中。

在CSS中，我们同样使用background-image将背景图片添加进去，同时也可以使用background-repeat和background-size等属性进行设置。

同时，我们还需要设置div块的宽度和高度，以确保图片可以完全显示。在此示例中，div块的宽度为100%，高度为300px。

声明：本文内容由网友自发贡献，本站不承担相应法律责任。对本内容有异议或投诉，请联系2913721942#qq.com核实处理，我们将尽快回复您，谢谢合作！