2006/12/21(木)console/xterm/blink記法

テーマ独自に記法を拡張しました。これらは今後開発するテーマに実装します。

div.console

console風なdivボックスを生成します。

span.blink

テキストを点滅させます。(IE6では点滅しません)

div.xterm

xterm風なdivボックスを生成します。(IE6未対応)

実際に使ってみる

ソース

>>>console
YUKI.N>みえてる?
 >[class:blink:_]
<<<

>>>xterm
YUKI.N>これは(ry
Ready?
 >[class:blink:_]
<<<

で、こうなる

YUKI.N>みえてる?
>_

YUKI.N>これは緊急脱出プログラムである。起動させる場合はエンターキーを、そうでない場合はそれ以外のキーを選択せよ。起動させた場合、あなたは時空修正の機会を得る。ただし成功は保障できない。また帰還の保障もできない。
YUKI.N>このプログラムが起動するのは一度きりである。実行ののち、消去される。非実行が選択された場合は起動せずに消去される。Ready?
>_

2006/12/10(日)[CSS] W3C規定とIE6の内容部分の計算の違い

W3Cで規定されている内容部分の計算

下記の色つき部分がwidthで計算されます。

margin

border

padding

contents

contents部分の幅はwidthで指定した値となります。

contents部分の幅 = widthの値

heightも同様です。

IE6の内容部分の計算

下記の色つき部分がwidthで計算されます。

margin

border
padding
contents

よって、IE6の場合はcontents部分の幅は

contents部分の幅 = widthの値 - paddingの値 - borderの値

となります。heightも同様です。

paddingがwidthに含まれることは知っていましたがborderまで含まれるとは思いませんでした。

2006/12/08(金)拡張リスト記法のテスト

ソース

-
-項目1
項目1の説明
-項目2
--項目2.1
>>
項目2.1の説明
<<
-項目3


-
-項目1

項目1の説明
-項目2
項目2の説明
-項目3
項目3の説明1

項目3の説明2

項目3の説明3
項目3の説明3のつづき

出力結果

  • 項目1
    項目1の説明
  • 項目2
    • 項目2.1

      項目2.1の説明

  • 項目3

  • 項目1

項目1の説明

  • 項目2

項目2の説明

  • 項目3

項目3の説明1

項目3の説明2

項目3の説明3
項目3の説明3のつづき

感想

標準(空行で改行処理。そのまま改行)モードだと上記のようになるっぽい。自分としてはリスト中で改行か段落処理かを切り替えるには

  • 項目中で空行挿入→直後の行を段落処理
  • 項目中で改行挿入→改行部分で改行処理(<br>挿入)

がこのパーサーの場合直感的に使える気がする。

-
-項目1

項目1の説明
-項目2
項目2の説明
-項目3
項目3の説明1

項目3の説明2

項目3の説明3
項目3の説明3のつづき

で以下のようなHTMLが出力される方が良かったのだが。

<ul>
<li>項目1
<p>項目1の説明</p></li>
<li>項目2<br>
項目2の説明</li>
<li>項目3<br>項目3の説明1
<p>項目3の説明2</p>
<p>項目3の説明3<br>項目3の説明3のつづき</p></li>
</ul>

出力結果としてはこんな感じ。

  • 項目1

    項目1の説明

  • 項目2
    項目2の説明
  • 項目3
    項目3の説明1

    項目3の説明2

    項目3の説明3
    項目3の説明3のつづき

2006/12/06(水)テーマを変更しました

作成中のテーマがとりあえず閲覧には困らない程度には出来上がったので変更しました。
Firefox/Operaでの閲覧を激しく推奨、IEでの閲覧を激しく非推奨((いや、もちろんIEでもそれなりに表示できるようには作りましたが、かなりの部分で処理が簡略化されています。
何よりもお姉さまになれません(爆)))。

システムモードとかカレンダーの部分はやっつけで調整に時間がかかりそう。このあたりがちゃんとできれば公開するつもりです。