CSS3

：

@規則

：

@page

　編集：2022.07.08 by T.A.

→●、mdn

ページボックスの種々の側面 ― 寸法、方位、マージンなど ― を指定できる。

@page <page-selector-list># { <declaration-list> }

<page-selector-list>: ＝<page-selector>#
<declaration-list>

<page-selector>: ＝[<ident-token>? <pseudo-page>*]!

<pseudo-page>: ＝':' [left | right | first | blank]

<declaration-list> ●

各種、ページ選択子の例。（宣言ブロックの中身は省略する）：

@page { ... }
@page :left { ... }
@page :right { ... }
@page LandscapeTable { ... }
@page CompanyLetterHead:first { ... } /* 識別子と疑似クラス。 */
@page:first { ... }
@page toc, index { ... }
@page :blank:first { ... }

ページマージン規則

@top-left-corner ： @top-left-corner { <declaration-list> };
@top-left ： @top-left { <declaration-list> };
@top-center ： @top-center { <declaration-list> };
@top-right ： @top-right { <declaration-list> };
@top-right-corner ： @top-right-corner { <declaration-list> };
@bottom-left-corner ： @bottom-left-corner { <declaration-list> };
@bottom-left ： @bottom-left { <declaration-list> };
@bottom-center ： @bottom-center { <declaration-list> };
@bottom-right ： @bottom-right { <declaration-list> };
@bottom-right-corner ： @bottom-right-corner { <declaration-list> };
@left-top ： @left-top { <declaration-list> };
@left-middle ： @left-middle { <declaration-list> };
@left-bottom ： @left-bottom { <declaration-list> };
@right-top ： @right-top { <declaration-list> };
@right-middle ： @right-middle { <declaration-list> };
@right-bottom ： @right-bottom { <declaration-list> };

テスト

ここに表示

スクリプト：

スクリプト：

表示内容：

CSS3

@規則

@page

ページ マージン規則

テスト

ページマージン規則