HTML Strict 增加行高
为什么 XHTML 1.0 Strict 显示的行高看起来比 XHTML 1.0 Transitional 中相同值的行高大？
因此，这会下推表格单元格内的内容（即 Firefox 中的 Hotmail、IE 和 Firefox 中的 Gmail）。还有其他人经历过这个问题并知道解决方法吗？
干杯
下面是每个 XHTML 类型的示例代码：
Transitional:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
</head>
<body>
<table width="500" border="1" cellspacing="0" cellpadding="0">
<tr>
<td style="line-height:18px;"><font style="line-height:18px; font-size:16px; font-family:Arial, Helvetica, sans-serif;">This cell will be larger in Strict</font></td>
</tr>
</table>
</body>
</html>
Strict:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
</head>
<body>
<table width="500" border="1" cellspacing="0" cellpadding="0">
<tr>
<td style="line-height:18px;"><font style="line-height:18px; font-size:16px; font-family:Arial, Helvetica, sans-serif;">This cell will be larger in Strict</font></td>
</tr>
</table>
</body>
</html>
Why does XHTML 1.0 Strict display a line height as appearing larger than a line height of the same value in XHTML 1.0 Transitional?
This therefore pushing down content within table cells (i.e Hotmail in Firefox, Gmail in IE and Firefox). Has anyone else experienced this issue and know a way around it?
Cheers
Heres an example code for each XHTML type:
Transitional:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
</head>
<body>
<table width="500" border="1" cellspacing="0" cellpadding="0">
<tr>
<td style="line-height:18px;"><font style="line-height:18px; font-size:16px; font-family:Arial, Helvetica, sans-serif;">This cell will be larger in Strict</font></td>
</tr>
</table>
</body>
</html>
Strict:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
</head>
<body>
<table width="500" border="1" cellspacing="0" cellpadding="0">
<tr>
<td style="line-height:18px;"><font style="line-height:18px; font-size:16px; font-family:Arial, Helvetica, sans-serif;">This cell will be larger in Strict</font></td>
</tr>
</table>
</body>
</html>
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（1）
@ryano 据我所知，对此没有明确的解决方案，大多数人似乎都在表格单元格本身上使用
margin-top:-2px;修复。希望有帮助。
@ryano as far as I am aware, there is not a definitive fix for this, most people seem to be using a
margin-top:-2px;fix on the table-cell itself.Hope that helps.