Bootstrap响应式图片的进一步处理

最近在做一个项目，首页特别简单

这是半成品，但是刚开始的时候使用图标的时候，遇到过一个较大的问题，接下来与大家分享。

既然是响应式布局，肯定我们的图片必须要有 class="img-responsive" ,我天真的以为问题可以解决了，接下来 ，我们在开发人员工具中查看效果，分别经历了三个状态，并没有达到我们的要求。

于是，我们查看bootstrap的源码，发现

.img-responsive {
  display: block;
  height: auto;
  max-width: 100%;
}

于是，我们便想，它没有控制图片的高度，要是我们强制给图片一个高度，那么，图片是不是最大就只能那么大了？的确是的，于是我们给它加上了样式 class=“img-responsive” style=“100px” （这儿我因为我div的宽度的关系我只给了100，大家可以根据自己的实际需要变化）。

至此，问题已完全解决。

bootstrap虽然说带了很多图标，但是难免有不够用的时候，因此附带给大家推荐一些图标，http://amazeui.org/，妹子UI，中国人的“boostrap”，带了很多图标，但是还是有不够用的时候，那么，http://www.iconfont.cn/，阿里巴巴的矢量图库还有更多你想不到的，大家有需要的时候请前往下载。