如何把一个图片不变形的放在更小的div中（适用于移动端）

html代码

<div class="title-img">
<img src="。。。"
alt="">
</div>

css代码

.title-img{
width:
100%;
height:
3.22rem;
margin:0
auto;
text-align:center;
overflow:hidden;
}
.title-img img{
max-height:
3.22rem;
max-width:
100%;
}

这样图片就能放到一个更小的div中了，而且不变形。