Question

当我删除DOCTYPE行时，此代码按我希望的方式工作。 “A”链接填充“Cell”单元格的完整单元格高度，将其悬停在单元格内的任何位置。注意：我需要使用A，而不是TD onclick javascript。我不明白为什么添加DOCTYPE会破坏它，或者我能做些什么来正确地修复它，这让我疯狂。我正在使用IE9，但希望它适用于所有浏览器。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>X</title>
<style type="text/css">
table,td, th {border: 1px solid #000}
td a {display: block; height:100%; width:100%;}
td a:hover {background-color: yellow;}
</style>
</head>
<body>
<table>
<tr>
 <td>
    <a href="http://www.google.com/">Cell</a>
  </td>
  <td>
    <a href="http://www.google.com/"><img alt="x" src="http://www.google.com/intl/en_ALL/images/srpr/logo1w.png"></a>
  </td>
</tr>
</table>
</body>
</html>

Answer 1

由于<td>的高度未定义（在布局中确定），因此忽略其子项的height: 100%;。

设置height的{{1}}和line-height：

<td>

演示：http://jsfiddle.net/ThinkingStiff/twVar/

td { height: 100px; line-height: 100px; }

html：为什么高度会因doctype而失败？

1 个答案: