For Paged Media
Hey、このPageを担当するゼ!
最近はPrintOutすることも多くなったよな。Yes!、Paperのことも考えなきゃいけない時代が来てるんだ。そして、それも考慮したStyleが指定可能なのサ! ここではその関係のことを解説していくゼ。
じゃぁ早速Let's Go!
ページボックスという概念
You! 「概念」なんてムズカしいWordがAppearしたからって、早速Exitしちゃイケないゼ。つまりは「ページボックスってなんなのさ」って事さ。
それじゃ、ページ媒体の一種、「紙」を考えてみようゼ。ページボックスってのは、その紙のデカさの事さ。前にBoxって考え方を教わっただろ。Yes! アレのPaged Versionさ! 一つ注意しておきたいのは、Too Wastefulな事に、Margin OnlyでPaddingもBorderもNothing、つまり無いって事サ。Margin AreaのSettingを最大限生かさなきゃならない。
MarginにもPage's Sizeにも'em'や'ex'といった単位はCannot Useなのサ。って事は、'px'はCan Use!? ・・それもアリだよな、半ば絶対単位だしナ。
Buuuuut!、ザンネンながら、ほとんどのUser Agentsは、これ以上説明するほど対応しちゃいないのサ。ハッ、シケてるゼ。
Referenceじゃゼンブ説明してるから、If You Have Interest、Go There!
改頁しようゼ
印刷の途中で文章が切れてて、「あー、ヤんなっちゃうゼ」なんて事があるだろ。「ここでページ変えたいのにー」って事もあるだろ。そんな時のPowerfulな味方がThese Propertiesサ。
page-break-before
値 | auto | always | avoid |
---|---|
初期値 | auto |
適用 | ブロック要素 |
継承 | しない |
page-break-after
値 | auto | always | avoid |
---|---|
初期値 | auto |
適用 | ブロック要素 |
継承 | しない |
Yes! コイツで改Page位置を調節するのサ! Let's Keyword!!
- auto
- その要素の直前・直後での改Pageを、強制も禁止もしない。
- always
- その要素の直前・直後での改Pageを常に強制する。
- avoid
- その要素の直前・直後での改Pageを抑制する。
コイツらって、互いに排他的じゃねぇだろ。そう、互いにぶつかり合うPossibilityがあるのサ。そういう時は、改Pageの強制が抑制よりもPriorするんだゼ。
改Pageをする場所
上の'page-break-before'、'page-break-after'は、ぶつかり合うPossibilityがあるのは、understand? ここじゃ、それをどう処理するのかを解説するゼ。
まず、改Page出来る場所は、大きく2ヶ所、Block boxesの間にあるmargin部分、それとBlock box内の行Boxes同士の間だ。
'page-break-before'or'page-break-after'が[always]のCaseじゃ、そこで必ず改Page Doだ。その要素の'page-break-before'と前の要素の'page-break-after'が異なるCaseだと、どう処理するかはUser Agents任せ。仕様書だと結果的に[always]と同じに処理するのがBestだと言ってるが、そうしなきゃならないワケじゃない。そこんトコ、注意してくれ。
で、行間での改Pageについてだが、これもイロイロSettingデキるんだが、それをマモらなきゃならないワケじゃない。
ほかにも、こんな事がBestなんだってよ。
- 改Page回数は出来るだけ少なくする。
- 強制改Pageで終わらないすべてのページは、出来るだけ同じ程度の高さを持つようにする。
- ボーダーがあるブロックの途中で改Pageは避ける。
- 表の途中で改Pageは避ける。
- フロート要素の途中で改Pageは避ける。
っかー、なんてShortなSectionなんだ! 次のSectionもやらせてもらうゼ、ベイベー。