CSS @page 规则

定義と使用法

CSS @page 規則は、カスタム印刷ページのサイズ、方向、およびマージンをカスタマイズするために使用されます。

例

カスタム印刷ページ：

@page :first {
  margin-left: 40%;
  margin-top: 50%;
}
@page :left {
  margin-left: 10%;
  margin-top: 10%;
}
@page :right {
  margin-left: 90%;
  margin-top: 90%;
}

実際に試してみる

CSS文法

@page {
  margin: value;
  page-orientation: value;
  size: value;
}

属性値

値 説明
margin ページの外側マージンを指定します。
page-orientation ページの方向を指定します。
size ページフレームの目標サイズと方向を指定します。

ブラウザのサポート

テーブルの数字は、@ 规則を完全にサポートする最初のブラウザのバージョンを示しています。

At-rule Chrome Edge Firefox Safari Opera
@page 2 12 19 No 6
@page: size 15 79 95 No 15
@page: page-orientation 85 85 No No 71
@page: @top-left 131 不支持 不支持 不支持 不支持
@page: @left-top 131 不支持 不支持 不支持 不支持
@page: @top-right 131 不支持 不支持 不支持 不支持
@page: @right-top 131 不支持 不支持 不支持 不支持
@page: @top-center 131 不支持 不支持 不支持 不支持
@page: @bottom-left 131 不支持 不支持 不支持 不支持
@page: @left-bottom 131 不支持 不支持 不支持 不支持