0
点赞
收藏
分享

微信扫一扫

背景图片大小

骑在牛背上看书 2022-04-16 阅读 114
前端

控制背景图片大小的属性介绍:

属性:background-size: ;

值:

contain

等比例缩放,背景图片显示完整,有可能铺不满盒子

cover

等比例缩放,铺满盒子,背景图片有可能显示不完整

写2个值:

第一个值代表宽,第二个值是高度.

  • px单位
  • 百分比%  注:参考的是盒子的百分比

注意:只写一个值,代表宽,另一个值默认auto,高度等比例缩放

控制背景图片大小属性的使用:

background-size: cover;
background-size: 300px 200px;
background-size: 50% 50%;
background-size: 100px auto;

背景属性的连写:

注:背景尺寸的连写前面必须有背景定位的值 背景定位/ 背景尺寸

background: #ccc url(./img/li.jpg) no-repeat 0 0 / 100px 200px;
举报

相关推荐

0 条评论