1

我已经制作网站几年了，但直到最近我才开始使用 html5 文档类型，今天我发现了将 4px 的 padding-bottom 添加到图像的行为。

如果将 doctype 更改为 xhtml1.0，则填充消失

这是一个简单的例子：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <title>Technic-Al</title>
    <style>
html, body {
margin:0;
padding:0;
}
#contain {
width: 900px;
background-color:#6C0;
}
</style>
</head>

<body>
<div id="contain">
<img src="images/head.gif" width="900" height="100" border="0" alt="head">
</div>
</body>
</html>

将 doctype 更改为其他任何一个都会删除底部填充（背景中的绿色）

很多人来这里建议修复

行高=0

我相信还有另一个修复方法也有效。

或者我应该说“变通”

但这肯定是 html5 文档类型的错误吗？

我们该和谁谈谈？谁处理这样的错误？我们如何修复它？

这里有人知道如何解决这个问题吗？

4

3 回答 3

2

我遇到了页面在页面底部显示填充的问题

img { display:block ; }

上面写在css文件中解决了我的问题。希望这有帮助

于 2013-08-12T11:59:17.937 回答
2

这不是一个错误，它是 CSS 规范所说的应该发生的事情。它不是 HTML5 特定的，HTML 4.01 strict和XHTML 1.0 strictdoctypes 会做同样的事情。

它不是填充 - 它是行框计算高度的结果。

没有希望改变它，太多的网页依赖于现有的行为。

相应的权威是W3C CSS 工作组。

于 2012-11-22T13:47:38.687 回答
1

Use the vertical-align property in your css :

img{
    vertical-align:top;
}
于 2012-11-22T11:12:53.617 回答