在图标后加文字居中的问题解决办法

一直以来有一个问题困扰着我,就是在文字前插入一个小图标,结果发现图标与文字总不在一条水平线上,一般表现为图片总比文字高一点。
虽然也有一些解决办法:
1、最简单的就是用 table 来控制图片和文字的居中,不过每次都要加许多代码,挺烦的。
2、就是用图片的 Align 属性设置为 align=”absmiddle” ,但也存在一个问题就是在标准的 W3C 中定义的 img 属性是不支持 Align 属性的。

今天看了一篇关于如何控制图标与文字居中的文章,是用 CSS 来解决这个问题的,在 CSS 中有一个关键的属性:margin-bottom 通过修改图片的外边框的底部高度就可以让文字移动上来。做法是把这个值设置为负数。例如我们把下面的 19X19 的图片设置它的 style=”margin-bottom:-5px” 这样文字和图片就居中了,这个值随着图片的大小不同而改变。