CSS3

@規則用記述子

page-orientation

  編集:2022.07.08 by T.A.

mdn

印刷されたページの回転法。

名前 page-orientation
用途 @page
upright | rotate-left | rotate-right
初期値 upright
算出値 指定値

高品質な印刷実装は、多様な[サイズ、方位]のページたちを取り扱えるので、作者は、ページの内容には何が最善かに則ってページのサイズを選べる。例えば、文書内のほとんどのページには、size に letter portrait を利用しつつ、幅広な情報テーブルをレイアウトするときは、size を letter landscape に切り替えることもあろう。

しかしながら、横幅が、まちまちな何ページかにフローしている内容の取り扱いは、比較的複階的なタスクであり、多くの普及している印刷実装(特に、web ブラウザー)においては、まだ解かれていない。page-orientation 記述子は、そのような実装を助けることが意図されており、各ページを単独の一貫したサイズでレイアウトしつつ、(PDF などの)出力媒体においては ― 異なる方位で表示するよう求まれるページが、それを行えるよう ― レイアウト後に方位を変更することを許容する。

upright
特別な方位は適用されない ― ページは通常どおりレイアウトされ、整形される。
rotate-left
次を指示する: 出力媒体が回転をサポートする場合には、ページはレイアウトされた後に、反時計回り(左回り)に 90°だけ回転して表示するものとする。
rotate-right
反時計回りに代えて時計回り(右回り)に回転することを除いて、rotate-left と同じ。

注記: マージン ボックスや他の位置的なものは、このプロパティとの特別な相互作用は無い。それらは、回転されないページ内に通常どおりレイアウトされてから、他すべてとともに回転される。

注記: このプロパティは、能力に劣る実装用の“つなぎ”として意図されており、実装が[サイズが まちまちな何ページかに内容をフローする能]を備える前でも、[縦置き、横置き]方位の混成による文書を印刷することを許容する。利用するには、多少余計な手間が要求される ― 英語のみ包含している幅広なテーブルが、実際には縦方向 writing-mode で“側転( sideways )”にレイアウトされるが、印刷された出力における可読性を得るため、回転して正立に戻すよう指定するなど。

高品質な印刷実装においては、このプロパティを利用する必要はないはずである ― 代わりに size を利用して、ページの方位を[portrait、landscape]どちらにするか制御すること。


テスト
HTML:

ここに表示
HTML:

ここに表示
スクリプト:


スクリプト:



表示内容:
表示内容: