html插入背景图片如何拉伸,css怎样拉伸背景图片？

在css中可以使用background-size属性来拉伸背景图片。background-size属性规定背景图像的尺寸，此属性可以使用数值、百分比、cover等设置图片拉伸。

background-size属性规定背景图像的尺寸。

语法：background-size: length|percentage|cover|contain;

属性值：值描述

length设置背景图片高度和宽度。第一个值设置宽度，第二个值设置的高度。如果只给出一个值，第二个是设置为 auto(自动)。

percentage以父元素的百分比来设置背景图像的宽度和高度。第一个值设置宽度，第二个值设置的高度。如果只给出一个值，第二个是设置为"auto(自动)"。

cover把背景图像扩展至足够大，以使背景图像完全覆盖背景区域。背景图像的某些部分也许无法显示在背景定位区域中。

contain把图像图像扩展至最大尺寸，以使其宽度和高度完全适应内容区域。

示例：

.box1 {

width: 200px;

height: 200px;

background: url(img_flwr.gif);

background-repeat: no-repeat;

}

.box2 {

background: url(img_flwr.gif);

background-size: 45% 100%;

-moz-background-size: 45% 100%;

/* 老版本的 Firefox */

background-repeat: no-repeat;

}

效果图：

更多CSS相关知识，可访问 CSS教程 ！！