渲染以下内容时，不考虑图像(img)的高度参数。但是，如果我根据 %(例如 80%)改变宽度，它会调整大小并且宽高比保持不变。如果我以 px 为单位提及高度，它会起作用。问题仅在高度为 % 且在所有浏览器中出现。
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Insert title here</title>
</head>
<body>
<img src="image.jpg" alt="Image" border="0" height="15%" width="100%" />
</body>
</html>
如果我们从 doctype 中删除“http://www.w3.org/TR/html4/loose.dtd”，如下所示，% 适用于高度，但在 IE 中不会考虑为图像提供的任何填充，但在其他浏览器中工作正常。
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Insert title here</title>
</head>
<body>
<img src="image.jpg" alt="Image" border="0" height="15%" width="100%" />
</body>
</html>
我尝试过使用 YUI 3 api 进行 CSS 重置。虽然它删除了浏览器的所有默认填充，但它不会解决我的问题。有什么解决方法吗？ 谢谢。
最佳答案
将以下 CSS 添加到我的 CSS 文件中就可以了。
html, body {
height: 100%;
margin: 0;
padding: 0;
}
谢谢我:D
关于html - HTML 中的高度百分比问题，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/3098842/