Sigilでepubを作ろう(2) スタイルシートを追加する
スタイルシートを追加する
スタイルシートのファイルを作成
「ブックブラウザー」で「Styles」を選択し、右クリックで「空のスタイルシート」を追加する。
ファイル名はなんでもいいけど、main.css にしときます。(右クリックで名前の変更可能)
一番先頭に
@charset "utf-8";
行間
ルビがある行とない行でおかしくなるので、調節は必須。
* { line-height: 150%; }
CSSを指定する
Section0001.htmlをコードビューで開いて、CSSを読み込むようにする
<title>銀河鉄道の夜</title> <link href="../Styles/main.css" rel="stylesheet" type="text/css" />
Section0001.htmlをブックビューに切り替えると、行間がちょっと開いて見やすくなった。
pタグのマージンを消す
pの前後の改行をなくしたい
p{ margin: 0; }
見出しの字下げ
もともとのテキストの見出しは「3字下げ」なので、margin-left をいれてみる。
h2{ margin-left:3rem; }
Section0001.htmlをブックビューに切り替えると、見出しが下がっているのがわかる。
ファイルをわけてみる
とりあえず章ごとにわけてみる
ブックビューで開く。
ファイルを分けたい部分、最初は「二、活版所」の「二」の直前に、カーソルをおいて、「Split At Cursor」のアイコンを押す。
するとSection0002.htmlが作成される。これをコードビューでみると、タイトルやCSSのタグの内容が、Section0001.htmlと同じであることがわかる。各章ごとにこれをやっていけばよい。
しかし、Section0001.htmlもコードビューでみて、一番下にいくと、h2 の余分なタグがはいっていたりするのでそれは削除する。なので、分割したら、その前のファイルの最後のほうをみて、余分なものがはいっていたら削除する。(スプリットの仕方が悪いのかも?)
目次を作り直す
もう一度「Generate Table Of Contents」をクリックする。
分割したときに先になるファイルの最後に変なh2が残っていると、この目次を作るときにわかる。
epubリーダーで、章が終わると頁がすすむことを確認する。