@media print
CSS中的媒体查询规则,用于定义网页在打印时应用的样式。当用户通过浏览器执行打印操作(如Ctrl+P)时,@media print中的CSS规则会自动生效,覆盖屏幕显示的默认样式。这是打印样式生成器的核心技术基础,所有生成的代码都包裹在@media print规则中。
@page规则
CSS中用于定义打印页面属性的at-rule。通过@page可以设置纸张大小(size)、页面边距(margin)、页面方向(orientation)等属性。例如 @page { size: A4; margin: 15mm; } 可以将打印页面设置为A4纸张并设置15mm边距。@page还支持:first、:left、:right等伪类,用于为第一页或左右页设置特殊样式。本工具生成的页面设置代码都基于@page规则。
print-color-adjust
CSS属性,用于控制浏览器在打印时是否保留元素的颜色和背景样式。默认值为economy,浏览器会为了节省墨水而移除背景色和背景图。设置为exact时,浏览器会严格按照CSS定义渲染颜色和背景。本工具的「强制保留颜色」选项就是通过设置print-color-adjust:exact实现的。需要注意的是,强制保留颜色会显著增加打印耗材消耗。
page-break-before/after
CSS分页属性,用于控制元素前后的分页行为。page-break-before: always强制在元素前插入分页符,使元素从新页面开始;page-break-after: always强制在元素后插入分页符。这两个属性常用于在章节标题前分页,确保每个章节都从新的一页开始。现代CSS也支持等效的break-before和break-after属性,功能更加强大和灵活。
page-break-inside: avoid
CSS属性,用于防止元素在打印时被分页打断。将其设置为avoid后,浏览器会尽量将该元素完整地放在同一页上,如果当前页放不下,会整体移到下一页。这个属性对于段落、表格、图片、代码块等需要保持完整性的内容非常重要。本工具的「避免在段落和表格中分页」选项就是基于此属性实现的。
orphans(孤行控制)
CSS属性,指定段落在页面底部最少保留的行数。例如设置orphans: 2时,如果段落只有1行能放在当前页底部,浏览器会将整个段落移到下一页,避免段落的最后一行孤零零地出现在页面底部。这个属性是专业排版中的重要概念,能显著提升打印文档的阅读体验。默认值通常为2。
widows(寡行控制)
CSS属性,指定段落在页面顶部最少保留的行数。例如设置widows: 2时,如果段落只有1行能放在当前页顶部,浏览器会将整个段落移到上一页,避免段落的第一行孤零零地出现在页面顶部。与orphans配合使用,可以实现完美的段落分页控制。默认值通常为2。
pt(磅/点)
打印领域的标准长度单位,1pt等于1/72英寸(约0.353mm)。pt是打印样式中最常用的字体大小单位,12pt大约等于屏幕上的16px。与px不同,pt是绝对单位,在不同设备和打印机上都能保持一致的物理尺寸。本工具生成的打印CSS代码默认使用pt作为字体大小单位,确保打印效果的一致性和可预测性。
mm(毫米)
公制长度单位,在打印样式中常用于设置页面边距和纸张尺寸。mm是最直观的打印尺寸单位,因为纸张规格(如A4的210mm×297mm)通常以mm标注。本工具的页面边距设置默认使用mm作为单位,让开发者能精确控制打印时的留白区域。与pt类似,mm也是绝对单位,不受屏幕分辨率影响。
::after伪元素
CSS伪元素,用于在选定元素的内容之后插入额外的内容。在打印样式中,::after伪元素最常用的场景是配合attr()函数在链接后显示URL地址。例如 a[href]:after { content: " (" attr(href) ")"; } 会在每个链接后显示其URL。本工具的「显示链接URL地址」功能就是基于此技术实现的,它让纸质文档的读者能够方便地获取链接的完整地址。
CSS选择器
用于选择和定位HTML元素的模式匹配表达式。在打印样式中,CSS选择器决定了哪些元素会被应用打印样式。例如 .nav 选择所有class包含nav的元素,header 选择所有header标签,.sidebar选择所有class包含sidebar的元素。本工具的「额外隐藏的选择器」功能允许开发者输入自定义的CSS选择器,精准控制需要在打印时隐藏的页面元素。多个选择器用逗号分隔。
UD5工具箱