background样式

五迷三道 提交于 2019-11-30 05:43:54

1.background-size

(1)可以指定数值,图片可能会失真

background-size:100px 100px ;  

(2)可以指定百分比

background-size:100% 100% ;  

(3)指定contain,包含 ,等比例缩放,图片是完整的,可能会留白

background-size:contain ;  

(4)指定cover,覆盖,等比例缩放,可能图片不完整

background-size:cover ;  

2.background-position

background-position:center center;

3.background-clip 背景裁切,可以设置背景的显示范围

(1)background-clip:border-box;(默认值) 显示范围:border+padding+content

(2)background-clip:padding-box;显示范围:padding+content

(3)background-clip:content-box;显示范围:content

4.background-origin 背景显示的原点

(1)background-originp:border-box;

(2)background-origin:padding-box;(默认值) 

(3)background-origin:content-box;

5.background-image:url('./image/图片.png')

6.background-color: #fff;

7.background-repeat   背景平铺

(1)background-repeat :repeat -x;

(2)background-repeat :repeat -y;

(3)background-repeat :no-repeat ;

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!