如何使用 html/css 进行打印答案

【问题标题】：How do I print using html/css如何使用 html/css 进行打印
【发布时间】：2020-09-25 10:27:36
【问题描述】：

我正在尝试打印一个 html/css 页面。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Test</title>
    <style media="print">
        body {
                background-color: blue;
            }
    </style>
</head>
<body>
    <div>
        <p>Imprime moi !</p>
    </div>
</body>
</html>

当我尝试打印时，正文背景不在这里。为什么？

编辑这个 css 不再起作用了：

@media print {
    body {
        background-color: blue;
    }
}

【问题讨论】：

打印时浏览器会自动删除背景颜色。您通常必须在浏览器的打印预览设置中专门将其打开。这不是你可以用 CSS 做的。

标签： html css printing media-queries

【解决方案1】：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Test</title>
    <style>
        body {
                background-color: blue;
            }
    </style>
</head>
<body>
    <div>
        <p>Imprime moi !</p>
    </div>
</body>
</html>

要么从你的样式标签中删除 media="print"，要么使用 'all' 或 'screen' 来代替

使用它会显示打印预览模式，该模式会从页面中删除背景颜色。

【讨论】：