解决css图片和文字不在一条水平线上

css解决文字和图片不在一条水平线上

通常情况下图片是默认顶部对齐，而文字则是默认底部对齐的，所以我们在布局时经常会遇到图片和文字不能对齐的问题。

解决方法很简单我们只需要给图片添加一条属性即可

img {
  width         : 20px;
  vertical-align: middle;
}

vertical-align: text-top;    //顶部对齐
vertical-align: middle;      //居中对齐
vertical-align: text-bottom; //底部对齐