:first

Baseline 2023

新推出

自 2023 年 8 月起，此功能已在最新的设备和浏览器版本中可用。此功能可能不适用于旧设备或浏览器。

:first CSS 伪类与 @page at-rule 结合使用时，表示打印文档的第一页。（有关节点的一般第一个元素，请参阅 :first-child。）

css

/* Selects the first page when printing */
@page :first {
  margin-left: 50%;
  margin-top: 50%;
}

注意：不能使用此伪类更改所有 CSS 属性。只能更改文档的边距、orphans、widows 和分页符。此外，在定义边距时，只能使用绝对长度单位。所有其他属性都将被忽略。

语法

css

:first {
  /* ... */
}

按下“打印！”按钮打印示例。第一页上的文字应该在页面中央附近，而其他页面的内容将保持默认位置。

html

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

css

@page :first {
  size: 8.5in 11in;
  margin-left: 3in;
  margin-top: 5in;
}

p {
  page-break-after: always;
  font: 1.2em sans-serif;
}

document.querySelector("button").addEventListener("click", () => {
  window.print();
});

规范
CSS 分页媒体模块第 3 级 # first-pseudo

此页面最后由 MDN 贡献者在 2025 年 7 月 14 日修改。