Question

在我的html中，有标题，侧边栏，页脚和<main>。在浏览器上阅读时它们很方便，但是当读者打印页面时，我希望它们只打印<main>部分，因为在纸张上打印时不需要侧边栏等。

我可以在打印时选择可见部分吗？

Answer 1

以下是我用于仅打印所需内容的内容。

<head>
    <style type="text/css">

    #printable { display: none; }

    @media print
    {
        #non-printable { display: none; }
        #printable { display: block; }
    }
    </style>
</head>
<body>
    <div id="non-printable">
        Side Bar Content
    </div>

    <div id="printable">
        Main Content
    </div>
</body>

Answer 2

当然，您使用媒体查询。

在你的css中使用媒体查询

@media print {
   … css goes here
}

您也可以使用单独的print.css文件

这里有article更详细的信息

Answer 3

尝试使用window.print进行打印：

<button onclick="myFunction()">Print this page</button>

<script>
function myFunction() {
    window.print();
}
</script>

然后使用css设置打印项目的样式：

@media print
{
    header{
      display: none;
    }
}

是否可以安排打印html？

3 个答案: