[分享]css3怎么在背景上加图片大小

在网页设计中，背景图片不仅可以给网页增色，而且可以为网页增加各种特殊的图案和效果。而在使用CSS3技术设计背景图片时，如何控制图片大小呢？接下来，我们就来详细讲解一下这方面的知识。 语法： backg...

在网页设计中，背景图片不仅可以给网页增色，而且可以为网页增加各种特殊的图案和效果。而在使用CSS3技术设计背景图片时，如何控制图片大小呢？接下来，我们就来详细讲解一下这方面的知识。

语法：
background-size: 宽度 高度; 

通过上述语法，我们可以为背景图片设置相应的宽度和高度。值得注意的是，该属性的参数可以有多个选择：

语法：
background-size: 像素值 比例 百分比; 

上述语法中，像素值表示背景图片的具体大小，比例表示背景图片大小相对于背景区域大小的比例，百分比能够让图片大小随着背景区域大小的变化而变化，从而实现一种流动的效果。下面，我们通过一个实例来进一步加深理解。

实例：
background-image:url(bgimage.gif);
background-repeat:no-repeat;
background-size:200px 150px; 

通过上述实例，我们为背景图片设置了宽度和高度。如上代码所示，我们通过background-image设置背景图片。background-repeat属性，则是让背景图片不断重复铺满整个背景区域。最后，我们通过background-size 属性设置了背景图片大小，宽度为200px,高度为150px。

通过本文的讲解，我们已经了解了如何通过CSS3技术为背景图片设置大小。在实际的网页设计中，合理掌握background-size属性，可以让网站更加美观与实用。