Entry

もし CSS を XML で書くとしたら

2007年01月18日

こんな風に書くことになるのかしらん。ちょっと妄想。

<?xml version="1.0" encoding="utf-8"?>
<s:stylesheet xmlns:s="http://qune.cside.com/2007/style"
              xmlns="http://www.w3.org/1999/xhtml">
  <!-- `@'で始まるモノとか -->
  <s:import value="foo.css"/>
  <!-- テンプレートが使えるとか -->
  <s:template id="tmp">
    <s:margin           value="0"/>
    <s:padding          value="0"/>
    <s:color            value="#fff"/>
    <s:background-color value="#333"/>
  </s:template>
  <!-- グローバルな要素はトップレベルに書く -->
  <p>
    <s:margin           value="1em"/>
    <s:padding          value="0"/>
    <s:color            value="#ddd"/>
    <s:background-color value="#333"/>
  </p>
  <!-- テンプレートを使う -->
  <div class="foo">
    <s:apply-template id="tmp"/>
  </div>
  <!-- 構造を意識したスタイル付け -->
  <html>
    <head/>
    <body>
      <s:margin  value="0"/>
      <s:padding value="0"/>
      <div id="head">
        <s:width value="100%"/>
      </div>
      <div id="body">
        <s:float value="left"/>
        <p class="entry">
          <s:background-color value="#fff"/>
          <s:color            value="#000"/>
        </p>
      </div>
      ...
    </body>
  </html>
</s:stylesheet>

まぁ,どんなもんでもいいんですけど,考えてみたのはこんな感じ。この記法の便利なところは,HTML(じゃなくてもいいんだけど)の構造に,直接スタイルを指定できるところです。「構造を意識したスタイル付け」といったところを見てもらうと分かる通り,スタイルの指定に直接 HTML の階層構造や `id' / `class' といった属性を指定できます。名前空間でスタイルの指定と HTML の本体を区別しているのがポイント。XSLT や XSL-FO と同じ具合ですね。

せっかくだから,同じようなスタイルを適用できるように,テンプレート機能みたいなもんを付けても面白いと思います(上記「テンプレートが使えるとか」「テンプレートを使う」参照)。あ,属性指定しちゃっても面白そうですね。

  <!-- テンプレートが使えるとか -->
  <s:template id="tmp">
    <s:margin           value="0"/>
    <s:padding          value="0"/>
    <s:color            value="#fff"/>
    <s:background-color value="#333"/>
  </s:template>
  <!-- テンプレートを使う -->
  <p s:template="tmp"/>
  <div s:template="tmp"/>

まぁ,これだけじゃ,あたしが勝手に考えた妄想なので,ブラウザが理解してくれるはずありませんよね。けれど,XML の体裁にしたってことは,巷の API を使っていろいろと操作できるはず。ブラウザが理解してくれる通常の CSS にすることも,それほど難しくありません。DOM なんか使うまでもなく,XSLT で対処できるんじゃないでしょうか。

個人的に CSS と XML は相性が悪いと思っているもんで,CSS を最終的なフォーマットとして残しておきたいとは思いません。CSS の形で残しちゃうと使い回しが利かないからです。XML だったら何かと使い出があるし(文書として扱うこともできる),パーサなんかも整っているから動的にスタイルシートを作ることもできます。

CSS に変換するくらいなら簡単そうだし,ちょっと作ってみようかな。でも,誰か作ってそうだな……。

Trackback
Trackback URL:
Ads
About
Search This Site
Ads
Categories
Recent Entries
Log Archive
Syndicate This Site
Info.
クリエイティブ・コモンズ・ライセンス
Movable Type 3.36
Valid XHTML 1.1!
Valid CSS!
ブログタイムズ

© 2003-2012 AIAN