Question

我有70像素高的图像。我想精确地创建一个框架，以便我可以使用此图像平铺其背景而不会导致滚动条出现。

预期结果：

-------
|this has 70 pixels
--------
| the rest

我的HTML看起来像这样：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN"
    "http://www.w3.org/TR/html4/frameset.dtd">
<html>
<head><title></title></head>
<frameset rows="70,*">
    <frame noresize src="a.htm" >
    <frame noresize src="b.htm" >
</frameset>
</html>

a.htm看起来像这样：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
   "http://www.w3.org/TR/html4/loose.dtd"
<html><head><title></title></head>
<body style="background-image:url(70px_img.gif);background-repeat:repeat;" >
    <img src="another_70_px_img.png" style="float:left;" />
</body>
</html>

现在，第一个freame的内部显然超过70像素，使滚动条出现。它也弄乱了里面的另一个图像，因为它有一个很小的空白空间，底部被裁剪。是否有可能使内框架具有精确的高度 - 我想知道是否有一些边框我必须设置在某处。

我知道scrolling="no"。但这并不能阻止内心的局面看起来如此糟糕。我可以通过提供内部图片height:50px但不是height:XX%来“解决”裁剪问题，但这似乎不对。

我也知道框架是邪恶的，并计划稍后将其重新用于<div>。过渡是否顺利还是我必须重新调整一遍？

Answer 1

您需要重置框架内html和body的边距和填充：

<style type="text/css">
    html, body { margin:0; padding: 0}
</style>

这可能会让你开始，但根据你想要的更多可能需要更多。可能还需要scrolling=no。

是的，不推荐使用框架。可能你不应该使用它们 - 但只有你知道！

Answer 2

如果没有内容越过边缘，请使用overflow:hidden;来阻止滚动条。

<body style="background-image:url(70px_img.gif);background-repeat:repeat;overflow:hidden;" >

帧的高度（以像素为单位）

2 个答案: