:first

简介

:first @page CSS 伪类选择器 描述的是：打印文档的时候，第一页的样式。

备注： 你不能改变所有的 css 属性。你只能改变 margins、orphans、widows、文档什么时候换页。别的所有 css 样式都会被忽略。

形式语法

Error: could not find syntax for this item

示例

HTML

<p>First Page.</p>
<p>Second Page.</p>
<button>Print!</button>

CSS

@page :first {
  margin-left: 50%;
  margin-top: 50%;
}

p {
  page-break-after: always;
}

JavaScript

document.querySelector("button").onclick = function(){ window.print() }

结果

点击下面的 print 按钮来打印这个例子。第一页的文字会在中间显示，其他页的内容在默认位置显示。

备注： 在定义 margin 的时候，你可以只用绝对长度单位，点击 length 查看更多内容。

规范

Specification
CSS Paged Media Module Level 3
# left-right-first

浏览器兼容性

BCD tables only load in the browser

参见