:first - CSS（层叠样式表） 编辑

简介

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

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

语法

:first

示例

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 查看更多内容。

规范

规范	状态	备注
CSS Paged Media Module Level 3 :first	Working Draft	无更改
CSS Level 2 (Revision 1) :first	Recommendation	首次定义

浏览器兼容性

We're converting our compatibility data into a machine-readable JSON format. This compatibility table still uses the old format, because we haven't yet converted the data it contains. Find out how you can help!

• Desktop
• Mobile

特性	Chrome	Edge	Firefox (Gecko)	Internet Explorer	Opera	Safari
基础支持	?	(Yes)	未实现	8.0	9.2	?

Feature	Android	Edge	Firefox Mobile (Gecko)	IE Mobile	Opera Mobile	Safari Mobile
基础支持	?	(Yes)	未实现	?	?	?

 

参见

• @page
• :left
• :right