←前へ 目次↑ 次へ→

4.7. CSSによるドキュメントのレイアウト

Copper PDFはHTMLとXMLをCSSによってスタイル付けすることができます。

Copper PDFは CSS Level 2 Revision 1 に準拠しています。 Copper PDFがサポートするCSSプロパティの一覧は資料集を参照してください。

4.7.1. スタイルシートの型

Copper PDFは、特に型が指定されていないスタイルシートをCSS(MIME型text/css)として認識します。 Content-Style-Typeヘッダ (HTML中では <meta http-equiv="Content-Style-Type" content="... といった記述) やstyle要素のtype属性等によってtext/css以外がスタイルシートの型として指定されている場合は、 スタイルシートをCSSとして認識しません。

4.7.2. メディアタイプ

style要素のmedia属性、あるいはCSSの@media指示子等でスタイルシートが適用されるメディアタイプが限定されている場合、 通常Copper PDFは印刷メディア向けのスタイルだけを適用します。 すなわち、Copper PDFのメディアタイプはall print paged visual bitmap staticのいずれかです。

なお、Copper PDFのユーザーエージェントのメディアタイプは output.media_types 入出力プロパティによって変更することができます。 適用するCSS 2.1のメディアタイプ名またはメディアグループ名を列挙してください。 例えば、ブラウザの画面表示用のスタイルを適用する場合は"all visual bitmap static screen continuous"を設定してください。

4.7.3. ドキュメント中にスタイルシートを記述する

ドキュメント中にスタイルおよびスタイルシートを記述する方法は以下の3通りがあります。

  1. HTMLのstyle属性
  2. HTMLのstyle要素
  3. jp.cssj.stylesheet処理命令

HTMLのstyle属性

style属性により、各要素に直接スタイルを指定する方法です。 style属性には、適用したいCSSのプロパティを記述してください。

<html>
<body style="border: 1px Black dashed;">
<h1 style="font-style: italic;">題名</h1>
<p style="text-decoration: underline;">本文<span style="font-size: x-large;">大きなテキスト</span>本文</p>
</body>
</html>

上記の例は以下のように表示されます。

題名
本文大きなテキスト本文

style要素はHTMLだけではなく、XML文書内でも利用可能です。 ただし、style要素が名前空間"http://www.w3.org/1999/xhtml"に属するように、名前空間宣言を行ってください。

<?xml version="1.0">
<body xmlns:html="http://www.w3.org/1999/xhtml" html:style="border: 1px Black dashed;">
<h1 html:style="font-style: italic;">題名</h1>
<p html:style="text-decoration: underline;">本文<span html:style="font-size: x-large;">大きなテキスト</span>本文</p>
</body>

HTMLのstyle要素

一般的なブラウザと同じくstyle要素内にスタイルシートを記述することができます。

<html>
<head>
<style type="text/css" media="print">
	body {
		border: 1px Black dashed;
	}
	h1 {
		font-style: italic;
	}
	p {
		text-decoration: underline;
	}
	span {
		font-size: x-large;
	}
</style>
</head>
<body>
<h1>題名</h1>
<p>本文<span>大きなテキスト</span>本文</p>
</body>
</html>

style要素はなるべくhead要素内に記述してください。 Copper PDFは他の場所のstyle要素も認識しますが、 ドキュメント中でstyle要素が現れる以前の部分には、記述されたスタイルが適用されなくなります。

また、XMLドキュメント中ではstyle要素によるスタイル指定は行わず、 次に説明するjp.cssj.stylesheet処理命令を使用するか、 あるいは一般的なブラウザでもサポートされているxml-stylesheet処理命令を使用してください。

jp.cssj.stylesheet処理命令

jp.cssj.stylesheet処理命令はHTMLのstyle要素に相当する機能を処理命令 (<?で始まり?>で終わるHTMLやXML中の特別な記述。) によって実現したものです。 HTML, XMLの両方のドキュメントの先頭で使用することができます。

style要素のtype, media属性に相当する部分はHTMLの属性と同様の形式で記述し、 スタイルシートは'[]'で囲みます。

<?jp.cssj.stylesheet type="text/css" media="print" [
	body {
		border: 1px Black dashed;
	}
	h1 {
		font-style: italic;
	}
	p {
		text-decoration: underline;
	}
	span {
		font-size: x-large;
	}
] ?>
<html>
<body>
<h1>題名</h1>
<p>本文<span>大きなテキスト</span>本文</p>
</body>
</html>

4.7.4. 外部のCSSの使用

ドキュメントと外部のスタイルシートを結びつける方法は以下の3通りがあります。

  1. HTMLのlink要素
  2. CSSの@import指示子
  3. xml-stylesheet処理命令

HTMLのlink要素

一般的なブラウザと同様に、link要素によってスタイルシートをドキュメントに関連付けることができます。

<link rel="stylesheet" type="text/css" media="print" href="スタイルシートのURL">

rel属性にキーワードalternateを加えることで、 1つのドキュメントに対して、複数の代替スタイルシートを用意することができます。 title属性は代替スタイルシートの名前です。

<link rel="alternate stylesheet" title="a" type="text/css" media="print" href="a.css">
<link rel="alternate stylesheet" title="b" type="text/css" media="print" href="b.css">

代替スタイルシートは通常は適用されませんが、 input.stylesheet.titles に代替スタイルシートのtitleを設定することで、適用するスタイルシートを選択することができます。

CSSの@import指示子

これは、HTMLのstyle要素とCSSの@importを組み合わせる方法です。

<style type="text/css" media="print">
	@import url(スタイルシートのURL);
</style>

HTMLのstyle要素の代わりに、jp.cssj.stylesheet処理命令を使うこともできます。

<?jp.cssj.stylesheet type="text/css" media="print" [
	@import url(スタイルシートのURL);
] ?>

xml-stylesheet処理命令

xml-stylesheet処理命令を使う方法は、 一般的なブラウザでXMLとスタイルシートを結びつけるために広くサポートされている方法です。

スタイルシートを適用したいドキュメントの冒頭で、以下のように記述してください。

<?xml-stylesheet type="text/css" media="print" href="スタイルシートのURL"?>

alternate属性はlink要素のrel属性に対するalternateの指定に相当するものです。 xml-stylesheet処理命令でalternate="yes"を指定することは、link要素にrel="alternate stylesheet"を設定するのと同じ意味です。

<?xml-stylesheet alternate="yes" title="a" type="text/css" media="print" href="a.css"?>
<?xml-stylesheet alternate="yes" title="b" type="text/css" media="print" href="b.css"?>

xml-stylesheetのtype属性にはCSSだけでなくXSLTスタイルシートを指定することもできます。 この場合、type属性にtext/xslを設定し、href属性にはXSLTファイルの指定してください。

4.7.5. デフォルトのスタイルシート

Copper PDFでは、ドキュメント内の記述に関係なく、特定のスタイルシートを適用する機能が用意されています。 input.default-stylesheet 入出力プロパティで指定されたスタイルシートが最初に適用されます。

4.7.6. 長さの単位

CSSでは、絶対単位としてmm, cm, in, pt, pcが使われます。 各絶対単位は、Copper PDFはCSSの仕様どおり次の一定の長さでレイアウトします。 PDFではptが長さの単位の基準となり、Copper PDFでも内部的な単位としてptを使用しています。 以下は各単位の関係です。

mm
1mm = 1/25.4in ≒ 2.835pt
cm
1cm = 10mm ≒ 28.35pt
in
1in = 72pt = 25.4mm
pt
1pt = 1/72in ≒ 0.353mm
pc
1pc = 1/6in = 12pt ≒ 4.233mm

相対単位としてem, ex, pxがあり、これは状況によって変化します。

em, exはそれぞれフォントの高さとxの高さを基準とした単位です。 正確には、文書中の基準となる位置で利用可能なフォントの高さの最大値と、xの高さの最大値を基準とします。 xという文字が存在しないフォントでは、exはxの高さではない「適当な高さ」となります。

pxは、output.resolutionで設定される解像度が基準となります。 デフォルトでは96dpiで、この状況では1pt ≒ 1.33pxとなり、1pxは1ptより若干小さくなります。 この値は、一般的なブラウザに合わせたものです。

ラスタ画像として結果を出力する場合、デフォルトでは出力結果の1ピクセルは常にCSSの1pxに一致します。 詳細は画像の出力を参照してください。


←前へ 目次↑ 次へ→
Copper PDF ©2012 Zamasoft. All rights reserved.