一起开始的旅程.

a) 什么多不做在FF3.6下面是这样的

b) 首先解决图片对齐问题：我是用的

处理后：

可以看到图片还是有点偏下，实际上偏差1px，检查原因是图片是16*16的，而文本框们的高度是21px(默认情况，修改样式不算),所以文本框计算应该中点在10.5px位置，图片的中心计算应该是四舍五入了，所以强制吧图片设置成奇数高度15试试：

现在图片对齐解决了

c) 接下来是单选按钮和复选框：

他们都自带margin属性，单选按钮是3 3 0 5，复选框是3 3 3 4（都是在FF下测试的）。

所以他们看起来很不和谐，那就把margin去掉：

依然没有对齐，再添加vertical-align: middle;

同样由于奇数问题没有绝对对齐，差距1px。可以采用把这些控件设置为偶数高度来解决，比如设置input{height:20px;}:

这样就是标准的对齐了。

d) 接下来是文本与这些控件的对决了，不处理情况是这样的

修正后:

这个修正方法是放狗搜的，具体原理与字体的样式有关，后面的这个是设置 font-family: Tahoma;（看来以前只是顾着用好看的字体，原来这些字体的设计也是很讲究的）

e) 最后是超链接的对齐：

好吧，不用处理了~不过在ie下面如果没有设置字体那么可能会出现对不齐的现象。

最后是结果：
FF：

IE6:

IE7：

IE8：

IE9:

在chrome下面还是有些对不齐，不过参看了facebook等网站，如果是表单一般都采用table嵌套，不会直接写form表单，最有用的可能只有图片和文字在行内的对齐，而正好这个解决方式是比较成熟的，很多地方都采用。