【page】ページボックス名を指定し要素に適用

pageプロパティでは、あらかじめ@pageで定義したページボックス名を指定して、要素にそのページボックスで設定したプロパティを適用させることができます。

ページボックスとは、印刷するページ(1つのページ)を1つのボックスとして捉えた考え方です。 このページボックスはhtmlには現れないため、印刷時のプロパティは通常のセレクタでは設定ができません。 そこで@pageなどを使用し、印刷する際の設定などを行います。

使い方は、@pageの後に半角スペースを空け、続けて任意のページボックス名を定義します。 「@page 任意の名前{}」というように記述し、{}内に各種プロパティを記述して下さい。

※@pageで指定できるプロパティは限られているので注意して下さい。

@pageで設定した内容は、要素に「page:任意の名前」というように指定すると、その要素に適用されます。 ただしpageプロパティはcss2.0で定義されていましたが、css2.1では削除されています。

書式

  • @page ページボックス名 {} ……… ページボックス名を定義する
  • page : ……… ページボックス名を参照する

★:auto、ページボックス名

auto
出力先に応じて自動設定します(初期値)
ページボックス名
@pageで定義した名前のページボックスを適用する

使用した時の例

@page name1 {margin: 150mm;}
p {page: name1;}

対応ブラウザなどのデータ

初期値 auto 値の継承 継承する
適用可能な要素 ブロックレベル要素
メディア paged / page

関連情報