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

見出しです

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

縦書き部分のソース

サンプル その2

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

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

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

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

縦書き部分のソース