Php 如何仅显示页眉和页脚之间的数据

我用一点CSS（在CSS中不是很好）完成了一个简单的html页面，以显示页眉和页脚之间的数据，但是当我用长数据创建一个表数据时，它与下一页的页脚和页眉重叠。代码如下：

p{之后的分页符：始终；}
.footer{位置：固定；底部：0px；}
.header{位置：固定；顶部：0px；}
这是标题

名字
姓氏
年龄
吉尔
史密斯
50
前夕
杰克逊
94
约翰
雌鹿
80
这是页脚

渲染和打印将有点不同

你试过合适的html5标签了吗

 <header class="header">this is the header</header><br>

    <p>lorem ipsum ...</p><br>
    <p>lorem ipsum ...</p><br>
    <p>lorem ipsum ...</p><br>
    <p>lorem ipsum ...</p>

    <footer class="footer">this is the footer</footer>

这是标题

lorem ipsum…


lorem ipsum…


lorem ipsum…


同侧眼线

这是页脚

渲染和打印将有点不同

你试过合适的html5标签了吗

 <header class="header">this is the header</header><br>

    <p>lorem ipsum ...</p><br>
    <p>lorem ipsum ...</p><br>
    <p>lorem ipsum ...</p><br>
    <p>lorem ipsum ...</p>

    <footer class="footer">this is the footer</footer>

这是标题

lorem ipsum…


lorem ipsum…


lorem ipsum…


同侧眼线

这是页脚

不确定这是否是您要问的问题，但

固定的位置超出了页面的正常流程。这意味着它不占用空间。因此，为了偏移，您可以将页面包装在一个div中，并为其提供与页眉和页脚大小匹配的边距

这样，内容就不会被标题覆盖。如果有滚动条，它仍然会被页脚覆盖。通常，您只会像这样修复标题

我还对背景上色以便于查看，并将它们从class
切换到ids
。这些是主页面元素，您应该只有一个，所以它们应该是ID

点击按钮来了解我的意思


$（文档）.ready（函数（）{
$（“#测试”）。单击（函数（）{
if（$（'#page'）.css（'margin-top'）=='60px'）{
$（'#page'）.css（'margin-top'，''）；
}否则{
$（'#page'）.css（'margin-top'，'60px'）；
}
});
});

p{
分页符后：始终；
}
#页脚{
位置：固定；
底部：0px；
宽度：100%；
高度：40px；
背景：#eee；
}
#标题{
位置：固定；
顶部：0px；
宽度：100%；
高度：60px；
背景：#eee；
}
#第{
/*页边距顶部：60px；/*应与页眉高度匹配*/
页边距底部：40px；/*应与页脚高度匹配*/
宽度：100%；
}
这是标题

名字
姓氏
年龄
吉尔
史密斯
50
前夕
杰克逊
94
约翰
雌鹿
80
这是页脚
不确定这是否是您要问的问题，但
固定的位置超出了页面的正常流程。这意味着它不占用空间。因此，为了偏移，您可以将页面包装在一个div中，并为其提供与页眉和页脚大小匹配的边距

这样，内容就不会被标题覆盖。如果有滚动条，它仍然会被页脚覆盖。通常，您只会像这样修复标题

我还对背景上色以便于查看，并将它们从class
切换到ids
。这些是主页面元素，您应该只有一个，所以它们应该是ID

点击按钮来了解我的意思


$（文档）.ready（函数（）{
$（“#测试”）。单击（函数（）{
if（$（'#page'）.css（'margin-top'）=='60px'）{
$（'#page'）.css（'margin-top'，''）；
}否则{
$（'#page'）.css（'margin-top'，'60px'）；
}
});
});

p{
分页符后：始终；
}
#页脚{
位置：固定；
底部：0px；
宽度：100%；
高度：40px；
背景：#eee；
}
#标题{
位置：固定；
顶部：0px；
宽度：100%；
高度：60px；
背景：#eee；
}
#第{
/*页边距顶部：60px；/*应与页眉高度匹配*/
页边距底部：40px；/*应与页脚高度匹配*/
宽度：100%；
}
这是标题

名字
姓氏
年龄
吉尔
史密斯
50
前夕
杰克逊
94
约翰
雌鹿
80
这是页脚
仅
.footr
使其位置
绝对
，并将
底部
设置为负长度：
i、 e:

更新
您也可以将
.header
位置设置为绝对位置，但会将其作为飞行header丢失

.header { position: absolute; top: 0px; }



p{之后的分页符：始终；}
.footer{位置：绝对；底部：-10px；}
.header{位置：绝对；顶部：0px；}
这是标题

名字
姓氏
年龄
吉尔
史密斯
50
前夕
杰克逊
94
约翰
雌鹿
80
这是页脚
仅
.footr
使其位置
绝对
，并将
底部
设置为负长度：
我