縦書き用スタイルシートを使用したサンプル その1

見出しです

縦書きのサンプルです。
太字です。斜体です。
括弧などは横書き字形を自動的に
回転させて表示します。↓「かっこ」
フォントを大きくしてみる
あかあかと
  日は難面(つれなく)も
 あきの風
松尾芭蕉
…とまあ、こんな具合なのですよ。
いかがでしょーか。

縦書き部分のソース

サンプル その2

縦エリアの二段組みや、
縦書きエリア・横書きエリアの
混在ももちろん可能。
 (ここは最初の縦エリア)
そして、横書きのエリア。

div.tate-areaには float:right; が指定されています。

この横書きエリアを囲んでいる<div>にも、float:right; を指定しています。
ふたつめの縦書きエリア。
みっつめの縦書きエリア。
このように、
新聞で見られるような
縦書きの多段組も
レイアウトできるのです。
スタイルシート "tate-style.css" で定義している
div.tate-separatorというやつに clear:both; を指定しているので、そいつを挟み込んでやれば改段ができますよ。

下にソースコードを表示しますので、見てみてください。

縦書き部分のソース