为什么高度不等于的高度在它的内部时DOCTYPE是XHTML 1.0严格？

StackOverflow https://stackoverflow.com/questions/1450274

  •  11-09-2019
  •  | 
  •  

题 

<!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" lang="en" xml:lang="en">
<head>
</head>
<body>

<table width="100%" cellspacing="0" cellpadding="0">
    <tr>
        <td align="right" colspan="5">
            <span class="validationInline">*</span> 
            <span class="hint">Required fields</span>
        </td>
    </tr>
    <tr>
        <td colspan="5" background="http://media.monster.com.hk/bgr_8.gif">
            <img src="/static/cleardot.gif" height="1" width="1" />
        </td>
    </tr>
</table>

</body>
</html>

可以检查出来这里： http://maishudi.com/tt2.html

我知道它是由DOCTYPE引起的，因为删除该部分将使其正常：

http://maishudi.com/tt.html

那么，什么是错的？我怎样才能使其与DOCTYPE工作？

有帮助吗？

解决方案

请注意：这可能取决于浏览器点击。 块级元素（TD，DIV，等），如果没有指定将仅大如需要，根据其内容所采取的空间的大小。如果指定，它将尝试相应扩大，请除了如果该含量更大，在这种情况下，它将根据需要扩大。

在你的实施例中，单元格中包含的单个字符（非换空间），其采取单线的大小。因此，块元件必须至少1行高高;它可以不承担任何更小的尺寸。这就是为什么你的身高声明被忽略了。

您可能需要使用这种风格：

line-height: 1px;

此设定线高度为1px。行高是不是一个元素，因此上述规则不适。

其他提示

添加样式块与此规则

td img {display: block;}

和看到 https://developer.mozilla.org/en/Images,_Tables， _and_Mysterious_Gaps 的更全面的解释。

背景不是TD元素标准属性的原因。而是使用：

style="background: url(/path/to/image.png);"

至于你的1倍像素的图像，我想这是简单地使表细胞出现？如果是这样，这不是做这件事的建议方式。你可以这样做：

table { empty-cells: show; }

在CSS虽然我不认为IE6支持。的更符合标准的方法是使用一种非断裂空间：

<td>&nbsp;</td>
许可以下： CC-BY-SA 和 归因
不隶属于 StackOverflow
scroll top