テキストを縦書きにして表示    
       
  テキスト(文章)を縦書きにして表示したいという場合があります。

これを実現するためには『<PRE></PRE>というタグで囲んで、思ったようなレイアウトにする方法』もできますが、『スタイルシート』を用いて、次のように記述する ことによって実現できます(このテキストを作成した2001年頃にはIE限定の機能でしたが、2015にはfirefox、Chromeなどでも実装されました)。

以下の部分を<head>〜</head>の中に記述して下さい。
 
<style type="text/css">
<!--div.param1 {writing-mode:設定値;
-->
</style>

『writing-mode:』の次(つまり、設定値の部分)には下のように指定します。
このWebページのソースファイルは横書きに設定されていますが、もし、これを縦書きに設定したいならば『<!--div.param1 {writing-mode:tb-rl;-->』というように設定すればよいのです。

表記法 説      明
lr-tb 横書きで表示
tb-rl 縦書きで表示

 雨ニモマケズ

 宮沢 賢治

 雨ニモマケズ
 風ニモマケズ
 雪ニモ夏ノ暑サニモマケヌ
 丈夫ナカラダヲモチ
 慾ハナク
 決シテ瞋ラズ
 イツモシヅカニワラッテヰル
 一日ニ玄米四合ト
 味噌ト少シノ野菜ヲタベ
 アラユルコトヲ
 ジブンヲカンジョウニ入レズニ
 ヨクミキキシワカリ
 ソシテワスレズ
 野原ノ松ノ林ノ蔭ノ
 小サナ萱ブキノ小屋ニヰテ
 東ニ病気ノコドモアレバ
 行ッテ看病シテヤリ
 西ニツカレタ母アレバ
 行ッテソノ稲ノ束ヲ負ヒ
 南ニ死ニソウナ人アレバ
 行ッテコハガラナクテモイゝトイヒ
 北ニケンクワヤソショウガアレバ
 ツマラナイカラヤメロトイヒ
 ヒデリノトキハナミダヲナガシ
 サムサノナツハオロオロアルキ
 ミンナニデクノボートヨバレ
 ホメラレモセズ
 クニモサレズ
 サウイフモノニ
 ワタシハナリタイ


 

 
       
  前のページへ