问题RT
解决方案
方法一： <!DOCTYPE html>文档声明改成HTML 4.01 Transitional 标准的。
方法二： vertical-align:top（经测验text-bottom,text-top,baseline以外的值都可以）
方法三： font-size:0忽略行高是否包含基线高度的影响。把基线高度设置为0
其实是dtd模式对空隙的解读不同导致了方法一的成功。
本质解析
【一句话点透】
行内替换元素包括：iframe,input,textarea,img,OBJECT 等。
非表单控件类行内替换元素就应该指的是iframe,object和img等。
滚动条的出现是看行框高度是否超过了父元素的高度。而非表单控件类行内替换元素的父元素的行高，在不同文档声明中，未必包含基线的高度。有可能预留出来基线高度，导致父元素与行内替换子元素之间存有空隙。
以iframe为例，当iframe的高度设置为100%时，父元素还要预留出基线的高度，所以实际内容高度就会为calc(100% - x)，x>0，自然就出现了滚动条。
那为什么vertical-align:top就可以了?父框的行高是基于字体尺寸计算出一个 "合理" 的值。该高度会受到vertical-align的影响。
疑惑
我觉得这个问题还是没解释透彻？
为什么是行高而不是高度？
滚动条到底是判断行高超出，还是判断内容超出，还是什么？
父框的行高和父框的高度什么关系？
