background-repeat
定义背景图像的重复方式,只有图片宽高小于元素宽高时才会有意义,取值为:
- repeqt (默认值)
- repeat-x
- repeat-y
- no-repeat
- round
- space
repeat
repeat是repeat-x和repeat-y的结合体,即在x轴和y轴上都进行重复
repeat-x
只在x轴上重复
repeat-y
只在y轴上重复
no-repeat
设置no-repeat恢复正常,既不在x轴也不再y轴重复
round
注意观察左边的默认平铺方式,是不是感觉x轴和y轴好像显示了三个,但都是图片显示的都不是特别完整,round属性值的意思就是,如果超出的部分大于50%背景图片的width或height就补齐,否则舍弃
- 例1:
- 例2:
space
space只放完整的图片,不完整的图片会被裁去,直到俩个图片之间的间隙够放下一个图片才会显示图片
- 例1:
- 例2: