1

我的网页是对另一个文档的逐页讨论。我想遵循原始文档的结构(带有标题、子标题和段落),但页码(或页面范围)也出现在 120 像素的边距中,就在该页面第一段的左侧) 我正在讨论。

到目前为止,我大致有我想要的。主要讨论在 DIV 标签内,带有“描述”。页码边缘保存在具有“页面”类的 DIV 标记内。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<HTML>
    <HEAD>
        <META HTTP-EQUIV="Content-Type" CONTENT="text/html; CHARSET=windows-1251">
        <TITLE>Blurble Blurble Blurble Blurble</TITLE>
        <STYLE>
        DIV.page            { border-style: solid; border-width:medium; float:left; position:relative; left:-100px; width:70px; padding:2px; }
        DIV.description     { position:relative; left:100px; }
        </STYLE>
    </HEAD>
    <BODY BGCOLOR="#FFFFFF" TEXT="#000000" LINK="#FF0000" VLINK="#800000" ALINK="#FF00FF">
        <H1>Blurble Blurble Blurble Blurble Blurble</H1>
        <DIV CLASS="description">
            <H2>Blurble Blurble</H2>
            <P>
            Blurble Blurble Blurble Blurble Blurble Blurble Blurble Blurble Blurble Blurble Blurble Blurble Blurble Blurble Blurble Blurble Blurble Blurble Blurble Blurble Blurble Blurble Blurble Blurble Blurble Blurble Blurble .
            </P>
            <P>
            Blurble Blurble Blurble Blurble Blurble Blurble Blurble Blurble Blurble Blurble Blurble Blurble Blurble Blurble Blurble Blurble Blurble Blurble Blurble Blurble Blurble Blurble Blurble Blurble Blurble Blurble Blurble .
            </P>
            <H2>Blurble Blurble</H2>
            <DIV CLASS="page">Blurble 1</DIV>
            <P>
            Blurble Blurble Blurble Blurble Blurble Blurble Blurble Blurble Blurble Blurble Blurble Blurble Blurble Blurble.
            </P>
            <P>
            Blurble Blurble Blurble Blurble Blurble Blurble Blurble Blurble Blurble Blurble Blurble Blurble Blurble Blurble Blurble Blurble Blurble Blurble Blurble Blurble Blurble Blurble Blurble Blurble Blurble Blurble Blurble .
            </P>
            <H2>Blurble Blurble</H2>
            <DIV CLASS="page">Blurble 2</DIV>
            <P>
            Blurble Blurble Blurble Blurble Blurble Blurble Blurble Blurble Blurble Blurble Blurble Blurble Blurble Blurble.
            </P>
            <P>
            Blurble Blurble Blurble Blurble Blurble Blurble Blurble Blurble Blurble Blurble Blurble Blurble Blurble Blurble Blurble Blurble Blurble Blurble Blurble Blurble Blurble Blurble Blurble Blurble Blurble Blurble Blurble .
            </P>
        </DIV>
    </BODY>
</HTML>

这里的问题是,无论页面 DIV 出现在哪里,该 DIV 元素和 P 元素的一部分之间都有一个间隙——一大块空白。似乎浏览器认为页面 DIV 元素应该位于该空间中,因此它将文本环绕在它认为 DIV 元素应该位于的位置。

除此之外,浏览器总是应该水平滚动条来滚动它认为应该添加到窗口的额外 100 像素的额外空间。

4

1 回答 1

1

我很确定您必须将 .page 类的位置属性更改为绝对。

于 2013-01-31T01:40:40.803 回答