在工作中，我最近为我们的一个客户推出了一个新系统，即 Rick Wilcox 魔术剧院。他们的网站主要提供关于他们和他们演出的信息，以及在线销售演出门票的平台。由于他们的剧院是度假目的地的一部分，人们经常提前很长时间购买门票。展示演出时间表的最佳方法是以日历格式呈现，让人们可以一目了然地看到几个月内的演出日期。
这个页面一直以来都是他们客户打印的热门页面。很长一段时间以来，我们所做的是提供一个 PDF 文件供下载，我们一直用最新的演出日期更新它。这允许一些不错的设计控制，但一直以来更新起来非常麻烦。因此，在推出新版本时，我认为这是构建一个专为打印设计的页面的绝佳时机，该页面可以与日历的其余部分动态保持最新。
在网络上，您可以依靠人们的显示器显示颜色（谢天谢地）。在网络上显示演出日历时，我们很好地利用了这一点。我认为，我第一次尝试打印样式表非常棒。它以磅为单位设置字体，很好地适应在一页上，除了必要的信息之外，其他所有内容都被删除了，并且看起来效果很好。除了一个致命的缺陷：它依赖于颜色。
这有两个问题
- 并非每个人都有彩色打印机。
- 背景颜色和图像默认情况下不会打印。
是的，这是用户可以更改的打印机选项，但您绝对不能指望您的用户知道或这样做。您无法从网络端控制这一点（据我所知）。
解决方案：想办法转为黑白
一种解决方案是使用列表样式的演示文稿，它不需要颜色来区分演出时间。但是我们真的很喜欢日历样式的演示文稿，所以我们需要一种方法来在一天表格单元格的有限范围内区分演出时间，而无需使用颜色。
CSS 边框来救援！
当然，它不如彩色解决方案漂亮，但它肯定能完成工作！
这实际上是一个非常巧妙的解决方案，现在我知道虽然背景颜色不起作用，但边框却可以：）。我想知道在打印文档时，还有哪些其他 CSS 属性没有被考虑在内……
非常好的观点，Luke。
也许这意味着 Chris 应该再写一篇关于 print.css 的精彩文章，以及哪些属性是打印机安全的和受支持的。*提示提示轻推轻推* 迁移离 PDF 的想法很明智。我唯一的建议是在运行时使用动态 PDF 生成器，否则这将花费太多时间和维护。
干杯，
Dormgear.net
您是否考虑过任何可以动态创建 PDF 的解决方案？如果您正在运行 PHP，则可以使用 FPDF (http://www.fpdf.org)。毫无疑问，还有很多其他的 - 而且不仅仅是基于 PHP 的。
我真的很喜欢这些问题>解决方案类型的帖子。真实的例子绝对是提供建议的最佳方式。
谢谢！
PS - 喜欢页脚中的 Twitter 气泡！
我喜欢您在首页上使用这些图形来计算日历的方式。我不会想到这样做。我会添加一个下载 PDF 按钮。我认为大多数可能想要打印的人会认为会有一个这样做的选项。但这是一个很好的技术解决方案。
当然，颜色更美观，但也认为并非每个人都有彩色打印机。例如：我有一个彩色打印机，但我在哪里可以订购黑白打印，而不是浪费墨粉。
一个疑问，如果我们使用灰度中的黑色而不是边缘会不好吗？
一个小错误：可打印页面在每个日历单元格中都有错误的链接！
谢谢，从服务器迁移到服务器的小调整=)
嗨，Chris，干得好！- 但如果边框在打印样式表中有效，那么如何也为它们着色以方便那些使用彩色打印机的人一眼就能看到？
显然，您仍然需要为那些使用黑白打印机的人使用点线/虚线/实线，因为产生的灰色阴影本身可能不够清晰……
我想，如果您需要比边框样式选项更多的变化，也可以使用不同的粗细！
继续努力！
Andy
那么为什么不将这两种方法结合起来，以便那些使用彩色打印机的人仍然可以使用颜色和边框进行打印，而那些没有彩色打印机的人只会获得带有边框的黑白打印呢？这样，当可打印页面在显示器上显示时，它将显示颜色以保持其美观。
可访问性如何？想知道日历的屏幕版本是否符合 WCAG 2.0：1.4.1 - 颜色的使用？
“此成功标准的目的是确保所有用户都可以访问由颜色差异传达的信息，即，通过使用颜色，其中每种颜色都分配了含义。如果信息是通过图像（或其他非文本格式）中的颜色差异传达的，那么色觉缺陷的用户可能看不到颜色。在这种情况下，通过其他视觉方式提供通过颜色传达的信息，可以确保无法看到颜色的用户仍然可以感知信息。”
http://www.w3.org/TR/UNDERSTANDING-WCAG20/visual-audio-contrast-without-color.html
也许打印版本也适合屏幕？
关于颜色本身对色盲人士来说是一个问题，这一点非常正确。幸运的是，当我们将鼠标悬停在每个日期上时，我们有 JavaScript 弹出窗口清楚地显示了演出时间。尽管……JavaScript 弹出窗口也不以其可访问性而闻名。
您可以始终使用 CSS 悬停“气泡”工具提示而不是 JavaScript 弹出窗口来显示信息。
我发现 JavaScript 可以像程序员想要的那样具有侵入性或非侵入性 - 这完全取决于使其易于访问，如果 JS 被禁用或不受支持，则提供相同功能的备用方法，然后使用 CSS 来设置样式。
在这种情况下，CSS 将优于 JS！
我是色盲，但我能读懂它。一切都很好。就这么简单。
非常感谢问题 - 解决方案布局。我昨天实际上遇到了这个问题。我决定为那些想要完整文档的人提供 PDF 版本。然而，这可能有效……并使用户更容易操作。
不错的解决方案，但我可能担心有人会混淆虚线和点线边框。也许改为使用双线？或者也许使用侧面边框来表示不同的演出时间；左侧是 7:30，右侧是 7:00 等。
如果当天没有演出，我也会将文本颜色更改为灰色，以提高演出日期的可见性。
非常巧妙的解决方案。
但是，您有（而且很幸运）
7:00 » 实线
7:30 » 点线
2:30 » 虚线
特别演出 » 2px 宽
…
但是，如果您添加更多演出时间呢？……嗯……我想您会依赖黑色百分比，例如 20%、50%、100%（使用保留字体 [白色字体]）。不确定其他类型的边框是否有效……然后是双边框？
测试这个解决方案能走多远会很有趣。
这在 IE6 中如何工作？我没有打印机。
再次，巧妙的解决方案。
PDF 版本将与网络版本共享颜色问题。仅仅因为我可以用完整的背景颜色打印它并不意味着我有一个彩色打印机。
我确实喜欢边框解决方案，尽管正如 rzea 指出的那样，如果您添加其他类型的演出，它确实无法扩展。
我更想知道你是如何得知你的用户打印了原始页面的。你是仅仅因为他们获取了 PDF 版本就假设他们打印了吗？
我相信这个理论可以应用于许多解决方案。你指出了一个现实世界的问题以及一个针对该问题的实用概念解决方案，并且可以针对不同的场景进行定制，做得好！
好主意，很好的解决方案。
那 IE6 呢——它不支持点状边框，（将其渲染为虚线），对吧？那么，它会像 7:00 pm 的框一样打印 2:00 pm 的框吗？（抱歉，我现在无法访问 IE6。）
除了这个问题，诚然，这可能不是最重要的问题，干得不错，谢谢。
我同意取消冒泡，你可以尝试让日历有一个“打印”按钮，当选中时，它会将页面生成到 PDF 中，然后而不是显示它，它只会打印你的 print.css 指定打印的内容。（fpdf 或 pdflib）
我一直觉得不允许作者覆盖背景打印设置毫无意义。如果背景颜色被标记为 !importing 或其他内容，则应打印它。
或者至少让浏览器检测到它并通知用户“此页面作者已指示您应启用背景颜色打印。您是否希望在打印此页面时启用此功能？[是] [否]”
无论如何……试试这个。
http://www.rickwilcox.com/shows/print.php在 print.css 文件中
.calendar td a {
display:block;
padding:0;
}
.a6F009F {
border-bottom:21px solid orange;
height:0;
padding:0;
}
.abb7902 {
border-bottom:21px solid coral;
height:0;
}
.a11bc1b {
border-bottom:21px solid skyBlue;
height:0;
}
.aSPECIAL, .aE48E00 {
border-bottom:18px solid lightgreen;
height:0;
}
#show-key span {
bottom:16px;
margin:0 5px 0 0;
overflow:hidden;
padding:0 6px;
position:relative;
}
可能在 IE 中失败，但在 Firefox 中打印正常。
使用粗边框的这个解决方案是一个绝妙的解决方案，非常适合我的需求！！非常感谢。我在 Firefox、Chrome 和 IE 8 中测试过，它可以工作！！
还有谁遇到过客户**坚持**要求其网站的打印输出必须与屏幕上的内容完全一致，以至于他们让你使用表格和 img 标签重新构建整个布局？
差不多，花了几个小时才说服他们放弃这个想法！
呼！
祝你好运。我遇到的每个客户都会抱怨这个问题。如果它不符合可访问性指南，它就不会被推送到打印堆栈中。
对于询问动态生成的 PDF 的人：并非每个人都有或想要 PDF 阅读器。我曾经创建了一个 Flash 打印机，因为当时超过 80% 的计算机都安装了 Flash（现在超过 90%）。它很轻便，可以从那里打印。它有点像 Flashpaper，只是没有那么多的品牌，也没有像演示文稿一样，并且与文档融为一体。
那是 Flash 8 的时候，但我现在很想再做一个。
我不是 Windows 用户，所以我不确定 Windows 上是否也是这种情况。但在 MacOS 上，如果你没有安装 PDF 查看器，它会用图片查看器打开所有 PDF 文档。
这是我用于所有 PDF 的方法。
我敢肯定 Windows 会抱怨的！
在打印任何作品之前，我都会在低档纸上进行测试打印，确保我的图像保持一致非常重要。只需要几分钟就能解决任何问题（清洁和校准喷头），如果你使用 A3+ 纸张，这样做很有意义。
我还在等有人给我们一个充分的理由，解释为什么默认情况下关闭了背景打印。
很简单。许多网站在深色背景上使用白色文本。打印这些内容会消耗整个打印机墨盒。最好不要打印背景。
与其说它是一个“解决方案”，不如说它是一个“聊胜于无”的东西……我的意思是，看看原始页面和打印版本。你怎么向客户解释这个？
@muckluck
你甚至不知道……98% 的客户的想法是“让我打印出来并在上面做笔记”。
所以现在，客户不再专注于更正内容，而是打电话询问“为什么网站打印不正确”。
有时候我真的很怀念表格。
嗨，Chris——很棒的文章。我希望你能在某个时候发一篇关于你如何实现那个日历以及它是如何工作的文章。
在博客上使用 jQuery 滑块整合一些小东西，比如对应帖子/甚至日期，这将非常棒。
很棒的文章……我想试试这个……
我必须同意 rzea 的观点，你的解决方案无法扩展，并且评论指出参考可能相当令人困惑。
但是，我必须说这是一个非常好的想法。从本质上讲，你是在要求潜在客户浪费他们自己的资源（纸张和墨水）来帮助你达成交易，他们需要使用的墨水越少（黑色也更便宜）和纸张越少越好，所以对于更便宜的解决方案，干得好，如果没有颜色，它也应该打印得更快，所以不会浪费时间。
总而言之——一个很棒的解决方案。
我希望更多的人使用特殊的打印 CSS 表格。我有一个主要的抱怨是，衬线字体在纸上更容易阅读，而无衬线字体在屏幕上更好。仅此一项更改，我关注的一些博客就可以更容易地脱机阅读。
Chris，太棒了，我目前也遇到了类似的岔路口。正如 savagecorp 所说，你介意分享你是如何动态创建日历的吗？太棒了。
我讨厌做那个家伙，但这可以做到。
要么是获取一些 PHP 代码来解析表格并让 GD 将单元格内容渲染为图像（并可能缓存它们）替换现有内容，要么是获取 Jquery 来解析表格并用预渲染的 JPEG 或 GIF 文件替换单元格内容。
我说过“这可以做到”，因为我们处理的是有限数量的替代方案（31 个数字乘以 5 种颜色 = 155 种替代方案），我们仍然需要处理月份标题。
我们还可以使用 fpdf 库在服务器端将其渲染为 PDF 文件……
不过，我们应该告诉用户，如果他们希望网站按原样打印，他们可以下载并安装 Cute PDF、Bullzip PDF 等工具（这些是免费的），然后打印到 PDF 文件并将其打印到纸上。
@chriscoyier
现在，有问题的网站使用你的方法作为其打印样式；)
将此放入你的打印 css 中，效果很好！