我正在开展一个元素,其中包括带有水印/叠加图像的 amcharts.com 图表(例如,如此处讨论:https://www.amcharts.com/kbase/adding-logo-watermark-exported-chart/)。图表包含在具有主体样式(例如,背景、框阴影等)的页面上的 div 中。使用导出项“打印”打印图表时,生成的打印包括主体样式(例如,背景和框阴影)。但是,我希望它在没有这些元素的情况下打印(例如,类似于“下载为...”子菜单中的“JPG”导出元素)。
可在此处找到示例:http://codepen.io/team/amcharts/pen/dc7015c33872771cf6e45e7752eaffe3 .要查看效果,请在现有 CSS 的顶部添加以下 CSS 后打印图表(使用图表右上角导出菜单的“打印”项):
body {
background-color: #999;
box-shadow: 0px 0px 10px 3px #444;
}
在 Windows 10 机器上,效果在 Firefox 中最为明显。在 Chrome 中,背景不可见,但如果“margin: 0px;”,则框阴影可见。从 html/body CSS 中删除。
可以通过使用 javascript 更改主体样式来删除背景和框阴影(在打印前删除背景和框阴影,然后重新添加),但这会导致令人反感的闪烁。是否可以完全从打印中排除 body (或其样式)?
最佳答案
要在文档处于打印模式时将 CSS 应用于文档,您可以使用 print
媒体查询并写下您希望发生的每个更改(@media print { ... }
@media print {
body {
background-color: transparent;
box-shadow: 0 0 0 transparent;
}
}
关于javascript - 打印 amcharts 时显示的 body 造型,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/38984870/