文章を縦書き表示する

ＣＳＳを使用した記述方法

記述方法

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title></title>
<style type="text/css">
<!--
p.wafuu { writing-mode: tb-rl; }
-->
</style>
</head>
<body>
<p class="wafuu">文書省略</p>
</body>
</html>

表示サンプル

当サイト（https://www.7key.jp/hp/）はリンクフリーです。当サイトに掲載している情報は、私（七鍵）がその内容を必ずしも保証するものではありません。情報の活用は利用者各自の責任の範囲内でお願いいたします。詳細は「取扱注意」を参照ください。

解説

ヘッダ内の記述にて、「P」タグの「wafuu」（名前は自由に付けてください）と言う名前のものに関しての表示方法を指定しています。個別に、

<p style="writing-mode: tb-rl;">ここの文章が縦書きになります</p>

のように記述をすることも出来ます。括弧や句読点は自動的に向きを調整し、英数字は横向けに表示されますので非常に使い勝手がよいのですが、執筆現在でＩＥ以外のブラウザは非対応となっています（普通に横書きで表示されます）。