CSS是一种非常强大的样式表语言,让我们可以控制网页的布局、颜色等等方面,这里我将介绍如何使用CSS让一张图片铺满整个网页。 html, body { height: 100%; } .bg-img
CSS是一种非常强大的样式表语言,让我们可以控制网页的布局、颜色等等方面,这里我将介绍如何使用CSS让一张图片铺满整个网页。
html, body {
height: 100%;
}
.bg-img {
background-image: url('your-image-url');
height: 100%;
background-position: center;
background-repeat: no-repeat;
background-size: cover;
}
首先,我们需要使整个页面的高度为100%,以便图片可以铺满整个屏幕。 接下来,我们创建一个CSS类.bg-img,将图片作为背景图像设置在其中,并使用cover属性将其缩放到铺满整个页面。
最后,将此类应用于你想要全屏显示图片的HTML元素,如body标签或者其他自定义元素。
让我们一起看看效果:
<body class="bg-img">
<!-- your content here -->
</body>
现在,你可以在自己网站中使用这个CSS来让一张图片铺满整个屏幕啦!
粉丝
0
关注
0
收藏
0