1 <!-- background-size 新属性 2 1、length：用长度指定背景图的大小，不允许负值 3 2、percentage：用百分比指定背景图大小，不允许负值 4 3、auto：缺省值，背景图的真实大小 5 4、cover：将背景图等比缩放到完全覆盖容器，背景图有可能超出容器 6 5、contain：将背景图等比缩放到宽度或者高度与容器的宽度或者高度相等，背景图像始终被包含在容器内 --> 7 8 <!DOCTYPE html> 9 <html lang="en"> 10 <head> 11 <meta charset="UTF-8"> 12 <title>Document</title> 13 <style type="text/css"> 14 .box{ 15 width: 200px; 16 height: 200px; 17 border: 2px solid #000; 18 margin: 50px auto 0; 19 background: url(图片1.png) no-repeat; 20 background-size: 200px 200px; 21 background-size: 100% 100%; 22 background-size: cover; 23 background-size: contain; 24 } 25 </style> 26 </head> 27 <body> 28 <div class="box"></div> 29 </body> 30 </html>
原文：https://www.cnblogs.com/kogmaw/p/12492732.html