我们要改变一幅图片的大小（或扩或缩），而又想保持原宽高比例不变，也就是说，既使图片缩得很小，图面也不会有丝毫的隐失，这完全能办到。下面，我们就先看看大小不同的两张图。 上面小图代码： ＜div style="width:300px;important;min-width:0px;height:auto;text-align:center;float:none;margin-left:auto;margin-right:auto;"＞＜img src="http://image109.360doc.com/DownloadImg/2022/08/3022/251183551_1_20220830101225960.jpg" style="width:100%;height:auto;" /＞＜/div＞ 代码解析： 为什么能使图片改变大小而能保持原宽高比例不变呢？为什么还使图片总是在居中位置呢？仔细看看代码就明白了，是那些“左”、”中“、”右“代码以及”自动“代码在控制的结果。 大图和小图，宽高比例相同，图面大小不同。它们的代码中宽度属性值是唯一调整图片大小的参数。（本例中，小图 width:300px 大图 width:400px 。） 给上面的图片加个边框仍然可以保持只变大小而不变宽高比例的效果。见下图。 带有边框的图片代码： ＜div style="width: 600px;important;min-width:0px;padding:5px;text-align:center;height:auto !important;border:4px #6699ff solid;background-color:#00ff00;"＞
＜div style="width:auto !important;min-width:0px;height:auto;text-align:center;float:none;margin-left:auto;margin-right:auto;"＞＜img src="http://image109.360doc.com/DownloadImg/2022/08/3022/251183551_1_20220830101225960.jpg" style="width:100%;height:auto;" /＞ 代码解析： 调整代码中的 width:580px 即可缩放图片。 下面是一幅边框抠图，可以任意改变其宽高，也可以保持宽高比例不变，进行缩放，方便朋友们选用。 边框抠图代码： ＜div style="width:700px;text-align: center; margin-right: auto; margin-left: auto; float: none;"＞＜img src="http://image109.360doc.com/DownloadImg/2022/08/3022/251183551_2_20220830101226241.png" style="width:100%;height:auto;" /＞ 代码解析： 将代码 height: auto; 中的 auto; 改用参数值，例如 400px; 就改变图片的宽高比例了。 | 
