第5回 CSSを使ってみる(前回の補足)
今回は予定を変更して、前回の補足を。 いや、決して書き忘れたとかじゃないﾃﾞｽﾖ・・・ なので、XMLデータは前回のものをそのまま使います。 で、XSLにはCSSを使う設定を入れます。<?xml version="1.0" encoding="Shift_JIS"?> <xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform"> <xsl:output method="html" encoding="Shift_JIS" /> <xsl:template match="/"> <html> <head> <style type="text/css" media="screen"> @import url(style.css); </style> <title> <xsl:value-of select="diary/title" /> </title> </head> <body> <div class="layout"> <h3 class="since">since 2004/06</h3> <div class="body"> <div class="titleimg"> <div class="titleshadow">What's XML</div> <div class="titlemain">What's XML</div> </div> <h2 class="title">Diary</h2> <p> 気まぐれ日記〜 </p> <xsl:apply-templates select="diary/form" /> </div> </div> </body> </html> </xsl:template> <xsl:template match="form"> <table class="diary"> <tr> <td class="diarydate"><xsl:value-of select="date" /></td> <td class="diarysubtitle"><xsl:value-of select="subtitle" /></td> </tr> <tr> <td colspan="2" class="diaryexp"> <pre> <xsl:value-of select="diaryexp" /> </pre> </td> </tr> </table> </xsl:template> </xsl:stylesheet>
正直言うと、今回XSLどうこうって言うのはありません^^; HTMLでCSS使うのと同じように、XSLでもCSSがそのまま使えます。 ただそれだけです。 CSSについてはCYBER@GARDENのCSS講座とかで調べてください^^; これを表示すると次のようになります。 まさにここそのまま XSL ちなみに今回使用したCSSはこちらです。 えー今回は補足ということで、説明はほとんどありません^^; (補足って説明を補うはずなのに・・・説明がないって事は補足じゃないのかも・・・) まぁCSSも使えますよーって事で、今回は以上です。