html图片压缩问题

图片展示的时候总是会出现压缩比例问题，我的解决方法是把图片放到div里面当背景展示

css代码

.background-div-img {
				/*设置不平铺*/
				background-repeat: no-repeat;
				/*图片铺满div不压缩*/
				background-size: cover;
				/*背景图片位置  可以自己调*/
				background-position: 65% 50%;
				height: 200px;
				width: 200px;
}

内容

<img src="img/testgril.jpg" width="200" height="200" />
		展示效果
		<div class="background-div-img" style="background-image: url(img/testgril.jpg);display: inline-block;"></div>
		<hr />
		<img src="img/shutu.jpg" width="200" height="200" />
		竖图修改
		<div class="background-div-img" style="background-image: url(img/shutu.jpg);display: inline-block;"></div>
		
		<hr />
		<img src="img/hengtu.jpg" width="200" height="200" />
		横图修改
		<div class="background-div-img" style="background-image: url(img/hengtu.jpg);display: inline-block;"></div>

把图片的位置"url(img/testgril.jpg)"换成自己想放的图片就可以了

效果