tr height和doctype

Question

我有以下传统的html代码。以前将 DOCTYPE 设置为 4.01 Transitional 的页面，但我将其更改为 html ，以便正确显示datepickers和其他jqueryui元素，但现在带有登录框的表格显示有一个奇怪的高度，在所有浏览器上计算大约18px。只是IE10显示它与预期（至少是以前的doctype发生的情况）2px高度。

我在这里创建了fiddle。我的页面中有额外的CSS，但正如你在小提琴中看到的那样，它不会影响渲染。

如何在输入字段 tr 之前和之后创建两个 tr ，使用html5 doctype以2px高度渲染？为什么表格行显示为18px，即使我用css强制它为2px？

<table border="0" cellspacing="0" cellpadding="0" width="100%">
    <tr border="1" >
                <td align="left" rowspan="1" width="100">
            <img src="http://webwork.maa.org/w/images/3/3f/Twitter-logo-50px.png" vspace="10" hspace="10" align="absmiddle" alt="Title" title="Title"/>
        </td>
        <td align="right" valign="top" class="si-blu">
            <font face="Arial, Helvetica, sans-serif">
            Marted&igrave;, 08 Marzo 2016 - 09:45:05&nbsp;
            </font>
        </td></tr>
<tr>
    <td align="right" colspan="2">
        <font face="Calibri" size="-2" color="#dddddd">
&nbsp;<br/></font>
    </td>
</tr>
<tr bgcolor="#184194">
    <td colspan="2"><img src="" width="2" height="2" border="0" alt=""/><br/>
    </td>
</tr>
    <tr bgcolor="#103073" valign="middle">
        <td align="right" colspan="2" height="30">
            <table border="0" cellspacing="0" cellpadding="0">
                <form method="POST" action="index.php">
                    <tr>
                        <td>
                            <div align="right"><font color="#ffffff" face="Arial, Helvetica, sans-serif" size="-1">Login</font>
                                <input class="small" type="text" name="Login"  value="" size="15"/>
                                &nbsp;</div>
                        </td>
                        <td>
                            <div align="right"><font color="#ffffff" face="Arial, Helvetica, sans-serif" size="-1">Password</font>
                                <input class="small" type="password" name="Password" value="" size="15"/>
                                &nbsp;</div>
                        </td>
                        <td>
                            <div align="right">
                                <input type="image" src="images/submit.gif" border="0" width="20" height="10" ALT="Login"  align="bottom"/>&nbsp;
                            </div>
                        </td>
                    </tr>
                </form>
            </table>
        </td>
    </tr>

    <tr bgcolor="#005555">
    <td colspan="2"><img src="" width="2" height="2" border="0" alt=""/><br/></td>
    </tr>
    </table>
    <table bgcolor="#ffffff" width="100%" cellpadding="0" cellspacing="0">
    <tr>
    <td  ><table width="100%" cellpadding="10">
 <tr>
  <td width="10%" valign="top">
     <br>
  </td>
  <td align="center" valign="middle">

   <br>  </td>
 </tr>
</table>

Answer 1

您可以为这些style="line-height:2px"元素添加td。