在编写网站的时候，给一个div设置背景图片，怎么让这个图片随着div大小的改变，而等比例的缩放。

原创于 2016-12-15 15:19:34 发布 · 6k 阅读

1 ·

CC 4.0 BY-SA版权

本文介绍如何使用CSS属性让div内的背景图片随着div大小的变化等比例缩放，通过设置background-size为cover确保图片始终填满div容器且保持原有宽高比。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

在编写网站的时候，给一个div设置背景图片，怎么让这个图片随着div大小的改变，而等比例的缩放。？

  background： url(**);
  background-size: cover;
  background-position: center center;
  v+="<div    class='jdal-img' onmouseover='aaa(this)' onmouseout='bbb(this)'  style=' width: 100%; height: 200px; background-image: url("+data.content[i].pictureUrl+"); background-size: cover;background-position: center center;z-index: 10;'>";
                     v+="<div  style=' width:90%; height:150px; padding-left:15px; padding-right:10px; opacity:0.85; z-index:11; color:#fff; font-size:15px; background-color:#03a9f4;  display: none; padding-top:50px; '><img style='width:70px;height:70px;margin-left:73px;margin-top:-30px; margin-bottom:20px;' src='images/xjdal-tb.png'><br>"+data.content[i].content+"</div>";