Question

我正在尝试在纸上打印一条我不想在屏幕上看到的线条。这就是我的工作：

<style media="screen" type="text/css">
.print {
    display: none;
}
</style>
<span class="print"><hr></span>

标尺显示在屏幕上和纸上。如果我在跨度内放置任何其他内容则不会显示。有什么想法吗？

Answer 1

尝试删除范围，并将条件应用于<hr>标记本身，因为这可能会重写。（您可以右键单击该行，并检查元素，它将显示是否覆盖了样式。）

<style>
@media print {
    hr { display:block; }
}

@media screen {
    hr { display:none; }
}
</style>

所以现在你可以在你的标记中使用<hr>，它只会在打印时显示。

将下面的示例复制到HTML文件中并进行查看，然后转到“打印预览”，您将看到打印预览中出现的行，但不会出现在屏幕上。

<html>
    <style>
        @media print {
            hr { display:block; }
        }

        @media screen {
            hr { display:none; }
        }
    </style>

    <body>
        <h1>This is a title</h1>
        <p>This is some text</p>
        <hr>
        <h1>This is a title</h1>
        <p>This is some text</p>
        <hr>
        <h1>This is a title</h1>
        <p>This is some text</p>
    </body>
</html>

如何在打印时显示<hr />，但在屏幕上查看时则不显示

1 个答案: