设置html背景图片拉伸平铺不重复
要设置HTML背景图片的拉伸,平铺和不重复,可以使用CSS的background属性。
拉伸:
要拉伸背景图片,可以使用background-size属性。例如,要将背景图片拉伸到整个屏幕,可以将background-size设置为100% 100%。
body {
background-image: url("background.jpg");
background-size: 100% 100%;
}
平铺:
要平铺背景图片,可以使用background-repeat属性。默认情况下,背景图片会在水平和垂直方向上平铺。可以将background-repeat设置为no-repeat,以防止图片重复。
body {
background-image: url("background.jpg");
background-repeat: no-repeat;
}
不重复:
如果要防止背景图片在水平和/或垂直方向上重复,可以将background-repeat设置为no-repeat,并将background-size设置为cover或contain。cover将图片放大或缩小,以完全覆盖背景区域。contain将图片缩小或放大,以适合背景区域。
body {
background-image: url("background.jpg");
background-repeat: no-repeat;
background-size: cover;
}
``
原文地址: https://www.cveoy.top/t/topic/gHRi 著作权归作者所有。请勿转载和采集!