html背景图片自动拉伸,css background:背景图片拉伸铺满

　　如何让背景图片拉伸填充？这个问题听起来很简单。但我很遗憾地告诉你。没我们想的那么简单。

　　例如，在容器(body、div、span)中设置背景。在css2.1之前，不能修改该背景的长度和宽度。

　　所以实际结果是只能重复显示，所以出现了repeat、repeat-x、repeat-y、no-repeat属性。它用于控制背景图片的显示。所以一般用作背景图片的有2类:

　　1.这是一个整体的大图，大小刚好和面积大小相匹配。

　　2.一个非常小的条形图，经过重复，形成了大图的非常规则的背景。

　　但css3出现后，这种情况得到了改善。背景大小的财产可以使我们以前的希望成真。

　　而且这个属性可以用在火狐、chrome、ie9上。具体使用方法如下：

　　背景尺寸(数值表示):复制代码如下：

　　#背景尺寸{

　　背景-尺寸：200px 100px

　　}

　　背景大小(百分比表达式):复制代码如下：

　　#背景尺寸2{

　　背景尺寸：30% 60%；

　　}

　　背景大小(等比例放大图片填充元素，即封面值):复制代码如下：

　　#背景尺寸3{

　　背景-尺寸：封面；

　　}

　　背景大小(按比例缩小图片以适合元素的大小，即包含值):按如下方式复制代码：

　　#背景尺寸4{

　　背景-大小：包含；

　　}

　　背景大小(用图片本身的大小即自动值填充元素):复制代码如下：

　　#背景尺寸5{

　　背景-大小：自动；

　　}

郑重声明：本文由网友发布，不代表盛行IT的观点，版权归原作者所有，仅为传播更多信息之目的，如有侵权请联系，我们将第一时间修改或删除，多谢。