CSS打印页脚

2024-05-29

98 次阅读

css 打印页脚

在CSS中，要为打印文档添加页脚，可以使用@media print规则来指定只在打印时应用的样式。以下是一个简单的例子，演示如何为打印文档添加页脚

<!DOCTYPE html>

<html>

<head>

<style>

@media print {

.footer {

position: fixed;

bottom: 0;

width: 100%;

text-align: center;

}

</style>

</head>

<body>

<div class="content">

<p>这里是文档内容...</p>

</div>

<div class="footer">

<p>这是页脚内容</p>

</div>

</body>

</html>

在这个例子中，.footer 类定义了页脚的样式，并且使用了position: fixed; 和 bottom: 0; 属性将页脚固定在页面底部，不会随内容的滚动而移动。这样，当文档在打印预览或打印时，.footer 中的内容会显示在每一页的底部，作为页脚。

标签: none