CSS可以使背景图片平铺显示，通常可以使用background-repeat属性来设置背景图片的显示样式。background-repeat属性可以设置为repeat，repeat-x，repeat-y，no-repeat，分别表示纵横向平铺，仅横向平铺，仅纵向平铺，不平铺。
使用background-repeat属性设置背景图片平铺显示
background-repeat: repeat|repeat-x|repeat-y|no-repeat;
其中，repeat表示纵横向平铺，repeat-x表示仅横向平铺，repeat-y表示仅纵向平铺，no-repeat表示不平铺。
使用background-image属性设置背景图片
background-image: url(image.jpg);
其中，url()表示背景图片的地址，可以是本地图片或者是网络图片。
使用background属性设置背景图片
background: url(image.jpg) repeat|repeat-x|repeat-y|no-repeat;
background属性可以同时设置背景图片和平铺方式，比background-image和background-repeat分别设置更加方便。
使用background属性设置背景图片的实例
background: url(image.jpg) repeat-x;
上面的代码表示，使用image.jpg作为背景图片，仅横向平铺的方式显示。
使用background-position属性设置背景图片的位置
background-position: left|center|right top|center|bottom;
background-position属性可以设置背景图片的位置，可以设置为左对齐，居中对齐，右对齐，上对齐，居中对齐，下对齐。
使用background-position属性设置背景图片的实例
background-position: right bottom;
上面的代码表示，将背景图片设置为右下角对齐。
使用background-attachment属性设置背景图片的滚动
background-attachment: scroll|fixed;
background-attachment属性可以设置背景图片是否随着页面的滚动而滚动，设置为scroll表示随页面滚动而滚动，设置为fixed表示不随页面滚动而滚动。
使用background-attachment属性设置背景图片的实例
background-attachment: fixed;
上面的代码表示，背景图片不随页面滚动而滚动。
CSS可以使背景图片平铺显示，可以使用background-repeat属性来设置背景图片的显示样式，可以使用background-image属性来设置背景图片，可以使用background属性来同时设置背景图片和平铺方式，可以使用background-position属性来设置背景图片的位置，可以使用background-attachment属性来设置背景图片是否随着页面的滚动而滚动。
千锋教育是高品质web前端培训机构，千锋教育拥有大量实力web前端培训讲师，提供优质的web培训课程，web前端培训，欢迎报名千锋教育。
京公网安备 11010802030320号