样式化的HTML元素在打印时看起来有所不同

时间:2019-07-06 02:59:15

标签: html css printing

我有一个非常简单的HTML文档,它是卡片的可视表示形式,该文档发送给通过我们的网站购买礼品卡的人。美元金额会添加到背景图片中,并由CSS设置样式。就像我说的。很简单。

在屏幕上,美元金额(右上角)显示为白色,这是我想要的。

How it appears on screen

但是在打印时(和在打印预览中),美元金额是深灰色的,这使得在背景下很难看到。

How it appears when printed

无论客户使用哪种浏览器,都会发生相同的情况。我已经在Chrome和Safari上进行了相同的测试。取决于客户的打印机,美元金额可能很难读取。

除白色以外的任何颜色似乎都可以正常工作。当我在Inspect Element中查看打印机仿真时,红色的CSS会显示为红色,并且将打印为红色。黑色CSS显示为黑色,并且将打印为黑色;但是白色CSS显示为白色时,每次都会打印为灰色。这让我发疯,而且我敢肯定这是一个简单的解决方案。

我们需要客户能够清晰地打印这些电子礼品卡。我在这里想念什么?

2 个答案:

答案 0 :(得分:0)

我的人生故事:我花了几个小时研究问题,发布问题寻求帮助,然后几乎立即找出答案。

问题似乎是浏览器不想在网页上显示白色时打印白色。说得通。白色不会出现在白纸上,因此会变成灰色。

解决方案似乎是在样式中添加function sList() { var pl = document.getElementById("PartList"); var value = pl.options[pl.selectedIndex].value; var text = pl.options[pl.selectedIndex].text; str = 'URL1 HERE='+ "'" + text + "'" ; //alert(value); //alert(text); window.location.href = str; } function SelectValue() { var pv = document.getElementById("PartList"); var value = pv.options[pv.selectedIndex].value; str = 'URL2 HERE' + value ; alert(value); window.location.href = str; } function SelectMain() { sList(); SelectValue(); } function alert(message) { console.info(message); } 。至少对Chrome和Safari有用。

答案 1 :(得分:0)

在我的工作下,他们在印刷中将显示一些不同的CSS样式代码。 您可以使用

import requests
from bs4 import BeautifulSoup as bs

with requests.Session() as s:
    r = s.get('http://archive.ontheissues.org/Free_Trade.htm')
    soup = bs(r.content, 'lxml')
    links = [item['href'] for item in soup.select('[href*="javascript:pop"]:contains(quote)')]
    for link in links:
        #rest of code working with Session

并检查结果。 我建议在所有页面中使用表格布局。