如何打印所有 css 样式附加到页面的网页？答案

【问题标题】：how can I print a web page with all its css style attached to the page?如何打印所有 css 样式附加到页面的网页？
【发布时间】：2011-03-24 00:50:31
【问题描述】：

我想添加一个打印按钮以使用户能够打印我的网页。但是，当我打印时，所有的 CSS 样式都丢失了。似乎打印机只保留基本的 html 元素。如果我还想完全按照浏览器中的样子打印页面，我应该怎么做？我的意思是，如果我使用彩色打印机，它会打印出带有 css 样式的彩色页面。当我使用黑白打印机时，它应该将浅色打印为白色，将深色打印为灰色或黑色。

【问题讨论】：

标签： css printing webpage

【解决方案1】：

如果您的link 元素上有media="screen"，请尝试将其删除或替换为media="all"。

【讨论】：

就我而言，根本没有 media 属性，但添加 media="all" 有效。起初我瞥了一眼这个答案，因为我知道我的链接上没有media="screen"。
media="all" 就像一个魅力。
我正在打开弹出窗口以使用 JS 进行打印。就我而言，我没有任何链接。

【解决方案2】：

CSS 样式表有一个属性media。它指定此 css 适用于什么媒体。列出了可能的媒体类型here。

<style type="text/css" media="all">
   @import "myCss.css";
</style>

或

<link rel="stylesheet" type="text/css" media="print" href="print.css">

【讨论】：

【解决方案3】：

看看this 和this，应该会有帮助。

基本上你需要添加一个css打印语句。

<link rel="stylesheet" href="URL to your print.css" type="text/css" media="print" />

【讨论】：