遠眼鏡屋2

縦書きブックリーダーを作る簡単な方法

デスクトップで読むブックリーダーというと AdobeAir で動く「Air草紙」やそのウェブ版の
「えあ草紙」が有名だ。これが威力を発揮するのは縦書きの小説などを読むときだ。

それより完成度ではだいぶん劣るが手元のウェブブラウザ(いまのところ IEGoogle Chrome のみ)でも、簡単な HTMLテンプレートと css ファイルを用意すれば、縦書き小説を楽しむことが出来る。

[手順]
1.適当なフォルダー/ディレクトリを作り、そこに次の二つのプログラム(vertical.css と vertical.html)をコピペ保存する。名称は一応指定どおりとする。

  ●vertical.css (IE/ Chromium 使用の場合 2017.05.08)


.vertical {
writing-mode: tb-rl;
-ms-writing-mode: vertical-rl;
-webkit-writing-mode: vertical-rl;
direction: ltr;
height: 500px;
width: 1000px;
overflow:auto;
line-height: 2.0em;
font-size:1.3rem;
}

  ●vertical.html


<HTML>
<HEAD>
<TITLE></TITLE>
<link rel="stylesheet" type="text/css" href="vertical.css">
</HEAD>
<BODY>
<DIV class="vertical">

   (本文)

</DIV>
</BODY>
</HTML>



2.青空文庫などから適当な長さの小説のテキストファイル(zipファイル)をダウンロードさせてもらい、解凍する(管理人の場合は「坊ちゃん」をダウンさせていただいた)。
[2013.01.26追記] 最新情報はこちら

3.解凍したテキストファイルを検索置き換え可能なテキストエディタに読み込み、全ての行末に <BR> を挿入した上で、全文を上記 vertical.html の「(本文)」の位置にコピペ保存する。
[2013.01.26追記] 最新情報はこちら


4.フォルダー/ディレクトリ中の vertical.html 上で右クリック、IE / Google Chrome を起動する。

5.これで全文が縦書きに表示されるから、ウィンドウの大きさ(マウス使用)や字体の大きさ(Ctrlキーと+またはーの同時押し)を変えて読みやすいものにする。管理人はゴシック体になるまで拡大して読んだ)。