可以看到下面的截图图1,左边图片,右面是文字,就会存在文字与图像的对齐问题。我们期待的是文字不要这么靠下。最初试图通过padding and margin都没有很好的解决。
事实上,本质原因是图文混排的默认值是vertical-align:baseline.显示效果为图一。基线是在图片最底部还要靠下的位置。
当我们设置为vertical-align:middle 或者vertical-align:bottom 都可以改变文字对齐。图2是将对齐方式改为居中的效果。
虽然代码简单,但是学习之初,经常会忽略这类小问题的本质原因。
Ps:脚本之家的解释更为详尽http://m.jb51.net/css/177178.html