XMLゼミ 5.1 XML文書と表示 5.2 CSS 5.3 XMLとXSL 高橋 辰裕
XML文書とスタイルの適用 XML文書をInternet ExplorerのようなWebブラウザでそのまま表示すると、XML文書のツ リー構造が表示される そこで 一般ユーザーに見せる形式としてあまり適切ではない スタイルを指定するドキュメントを作って、それをXML文書に適用する XML文書の書式を整えて表示することができる 現在、一般的によく使われているスタイル指定の方法として次のような方法がある ・ XML文書にXSLTを適用して表示する方法 ・ XML文書でCSS(Cascading Style Sheet)を使って表示する方法
XML文書の操作 XSLの仕様は、XSL-Formatting ObjectとXSL-Transformation(XSLT)とで構成されている ・ Formatting Object 情報の書式を整えるためのオブジェクトの仕様 ・ XSLT XML文書の情報を変換するための仕様 XSLTを利用してXML文書を操作できる ・ 情報の取り出し、並び替え、変換など
CSS ・ CSSとは、CSSスタイル規則を列挙したもので作成方法は以下のとおりである CSSスタイル規則の書式 「スタイルを適用するオブジェクト」 { ( 「プロパティ名」 : 「プロパティ値」 ; ) + } タグ名 CSSスタイルシートの例 <!– adrsstyle.css --> Name { font-size:18pt; color:green; } TEL, FAX { font-size:12pt; color:red; } 注 CSSの記述の方法はXML文書の形式ではない つまり、タグを使わず、ツリー構造にはしない
CSSファイルをロードする処理命令の形式 フォント、色と背景色、テキスト、ボックス、表示形式などを指定することができる。 主なCSSの属性は教科書P112の表5.1を参照 注 拡張子をCSSにする ・ CSSを利用するには、 まず、CSSファイルを別のファイルとして作成し、 次に、XML文書の中でxml-stylesheet処理命令を使う という2つの作業を行う 注 属性をtype=”text/css”にする CSSファイルをロードする処理命令の形式 <?xml-stylesheet type=“text/css” href=“スタイルシートファイル名”?>
CSSファイル(adrsstyle.css)を使うXML文書の例 <?xml version=“1.0” encoding=“UTF-16” ?> <!– cssdoc.xml --> <?xml-stylesheet type=“text/css” href=“adrsstyle.css”?> <Address> <Member> <Name>二戸 丹子</Name> <TEL>2525-0110</TEL> <FAX>2525-0111</FAX> </Member> <Name>低音 出留蔵</Name> <TEL>0301-0110</TEL> <FAX>0301-0111</FAX> </Address>
主な書式設定オブジェクトは教科書P115の表5.2を参照 XSL XSL(Formatting Object)を利用して、XML文書を表示する際のマージン、色、文字サイズなどを定義できる XSLの中でも特にXSLのフォーマット名前空間に定義されている書式設定オブジェクト(フォーマット指定タグ)という要素が頻繁に使われる 注 以前のXSL (XML Stylesheet Language)は、現在では XSL Formatting Objects(XSL-FO)と同じ意味で使われている 主な書式設定オブジェクトは教科書P115の表5.2を参照
XSL XSL書式設定の典型的なスケルトン <?xml version=’1.0’ ?> <xsl:stylesheet xmlns:xml=“http://www.w3.org/1999/XSL//Transform” xmlns:fo=“http://www.w3.org/1999/XSL/Format “ version=‘1.0’> (スタイルシート定義) </xsl:stylesheet> 注 慣習としてfoが使われる XSL書式を適用する典型的なパターン <xsl:template match=“ [パターン] ”> <fo:[書式設定オブジェクト] [パラメータ]> <xsl:apply-template /> <!—処理命令--> </fo: [書式設定オブジェクト] > </xsl:template>
課題 CSSスタイルシートでフォントのサイズを20ポイント、フォントの色を青、背景色を黄色に指定したCSSファイルを利用したXML文書を作成せよ