图标自适应问题，请教，谢谢！~

Question

做的网页，小图标正常显示没有问题，在手机上或页面缩小时图标变大失真，CSS怎么修改？谢谢~

正常的是这样的：

手机上显示这样的，图标变得很大：

代码是这样的，增加max-width和max-height都没有效果：

<div style="float:left;width:30px;height:30px;line-height:30px;"><img src="images/star.png" style="width:20px;height:auto;vertical-align:middle;" />&nbsp;</div>

Answer 1

把图片的height固定设置为20px试试。