在css中,可以使用background-size属性来改变背景图片大小,该属性的作用就是指定背景图片大小,可通过将属性值设置为长度值或百分比来改变图片大小,或者通过将属性值设置为cover和contain关键字来对图片进行伸缩处理。

本教程操作环境:windows7系统、CSS3&&HTML5版、Dell G3电脑。
在CSS中,想要改变背景图片的大小,可以通过设置background-size属性来实现。
background-size属性可以指定背景图片大小。语法格式:
background-size: length|percentage|cover|contain;
-
length 设置背景图片高度和宽度。第一个值设置宽度,第二个值设置的高度。如果只给出一个值,第二个是设置为 auto(自动)
立即学习“前端免费学习笔记(深入)”;
percentage 将计算相对于背景定位区域的百分比。第一个值设置宽度,第二个值设置的高度。如果只给出一个值,第二个是设置为"auto(自动)"
cover 此时会保持图像的纵横比并将图像缩放成将完全覆盖背景定位区域的最小大小。
contain 此时会保持图像的纵横比并将图像缩放成将适合背景定位区域的最大大小。
background-size属性可通过长度值或百分比来设置图片大小,或者通过cover和contain来对图片进行伸缩设置。
新视窗企业管理系统是一款小巧、实用、利于后续开发的ASP程序。适合大中小型企业的网站建设。1、新闻管理 2、产品管理 3、订单管理 4、广告管理 5、下载管理 6、留言管理 8、单页栏目(如企业简介,资质荣誉)9、人才招聘等等。 新视窗企业管理系统 5.1 更新日志:1、修改产品列表的图片自动缩略,防止图片变形.2、修改后台添加产品分类时,排序ID不写入数据库的错误.3、修改首页企业简介的链接地址
示例:
原始背景图片大小
本身这个图片宽度为400px,高度225px
通过CSS修改背景图片大小,图片宽度为200px,高度112px
效果图:

(学习视频分享:css视频教程)









