CSS的平铺背景可以实现让图片或颜色一直重复出现,填充整个页面。下面我们就来介绍一下CSS设置平铺背景的方法。
第一种方法:使用background-repeat属性
在CSS中,可以通过设置background-repeat属性来实现平铺背景。background-repeat属性默认值为repeat,即不断重复图片或颜色。当然,我们也可以设置其为no-repeat,使之不重复。
以下是一个例子,将图片平铺至整个页面:
body { background-image: url(图片地址); background-repeat: repeat; }第二种方法:使用background-size属性 在CSS3中,还有一种更加灵活的方式来设置平铺背景,即通过background-size属性。该属性可以设置背景图片的大小,包括宽度和高度,还可以设置cover和contain两个值,分别表示背景图片铺满或被包含在容器中。 以下是一个例子,将图片以cover方式平铺至整个页面:
body { background-image: url(图片地址); background-size: cover; }总结 以上就是CSS设置平铺背景的两种方法,可以根据需求来选择实现方式。如果只是简单的平铺背景,那么使用background-repeat属性就可以满足需求。如果需要更加灵活地控制背景图片的大小,那么可以选择使用background-size属性。