表示調整
閉じる
挿絵表示切替ボタン
▼配色
▼行間
▼文字サイズ
▼メニューバー
×閉じる

ブックマークに追加しました

設定
0/400
設定を保存しました
エラーが発生しました
※文字以内
ブックマークを解除しました。

エラーが発生しました。

エラーの原因がわからない場合はヘルプセンターをご確認ください。

ブックマーク機能を使うにはログインしてください。
ギルガメッシュ  作者: 髑髏嫐 幽空
†特殊設定†
5/16

#1 - 05 レイアウト変更方法

 なろう小説のレイアウトを自分好みに変更する方法は作者側とは別にユーザー側でもある程度は可能である。

 筆者はオフラインで読む事が多い。pdfファイルよりHTMLファイルで。

 まず該当する小説を『名前を付けて保存』する時、『webページ完全』ではなく『HTMLのみ』を選択する。話数が多い小説は手がつりそうになるけれど根気よく頑張ってもらいたい。――作者側もそのことに配慮すれば話数をもっと節約できる筈なのに。

 共通するフォルダを一つに統合し、各ページのソースを書き換えていく。そうすることで無駄を(はぶ)き容量を節約する。

 最初に保存する時に『webページ完全』でフォルダの中身を得ておく。後はコピーして使い回しする。

 保存した時、生成されたフォルダの中にいくつかの『css』ファイルがある。その中の『kotei.css』が小説のレイアウトに関係する。これはノクターン、ミッドナイト、ムーンライトと共通である。

 個人の好みもあるだろうけれど、興味があれば変更してみるも良し。


※2020年12月より『ncout.css』は『kotei.css』に名称が変更された。


      ●  ☆  ●


 背景を変更する場合、更新時に作者側で行っているとcssファイルではなくhtmlファイルに直接書き込まれている場合がある。

 その際に変更する例は以下の通り。あくまで一例として――


 とある作品のHTMLファイル。

<style type="text/css"><!-- body {background-color:#ffffff;}dl.novel_sublist2 {border-bottom:1px solid #ffffff;}#novel_color {color:#444444;}#novel_contents div.novelrankingtag {color:#444444;}#novel_contents a {color:#0033cc;}.upper a {color:#0033cc;}#novel_contents a:visited {color:#885577;}.upper a:visited {color:#885577;}#novel_contents a:hover {color:#339933;}dl.novel_sublist2:hover {border-bottom:1px solid #339933;}.novel_view {font-size:100%;}.novel_title {font-size:170%;}.novel_subtitle {font-size:170%;}.novel_view {line-height:180%;} --></style>


 自分好みに変更する時、上記の全てを変える必要は無い。

 『置換』する部分は『background-color:#ffffff』だ。これは一か所だけ。

 これを『background-color:#c8bebe』とする。カラーコードは自分好みに選んでおく。

 文字の大きさ、色の変更も個人好みに変えていくことも可能。


      ●  ☆  ●


 『一字下げ』はcssでは出来ない。出来る方法があれば教えてほしいものである。――直接、一字スペースすればいい、と言われるかもしれない。だが、長文を一括で変更するのは至極面倒である。作者側がしっかりとやってもらいたいものだ。


      ●  ☆  ●


 多くの作者はデフォルト設定のままである。

 上記に示したように『kotei.css』のソースを書き換えていく。

 通常背景を長時間見ていると疲れ目になりやすい。特に明るい色調はきつい。かといって黒がいいというわけにもない。

 その辺りは各個人が自分の目に優しくなる色を見つける必要がある。

 以下に変更例を載せる。該当する箇所はテキストエディタの『検索』を使用する。


 背景色。

body {

background: rgb(200, 190, 190); color: rgb(68, 68, 68); font-family: "Lucida Grande", sans-serif; font-size: 14px; -webkit-text-size-adjust: 100%;

}


 本文の横幅調整。

#novel_honbun {

margin: 30px auto 50px; padding: 0px 20px; width: 600px;

}


 本文の文字色。

#novel_color {

width: 100%; color: rgb(70, 70, 100); font-size: 22px;

}


※短編の場合、フォントサイズ18~20pxを推奨。


 筆者の作品群は『#novel_honbun』のみ変更。ソースは以下である。

#novel_honbun {

margin: 30px auto 50px; padding: 0px 2px; width: 800px;

}


 色は事前に設定済みなので。

 ――個別の色を変更するタグや文字の大きさを指定するものが欲しいところである。


評価をするにはログインしてください。
この作品をシェア
Twitter LINEで送る
ブックマークに追加
ブックマーク機能を使うにはログインしてください。
 『名前を付けて保存』した時に生成される『kotei.css』のソースの一部を以下に変更すると作者が普段PCで確認しているスタイルに近くなります。

#novel_honbun {margin: 30px auto 50px; padding: 0px 2px; width: 800px;}
※旧『ncout.css』と同様の変更が可能。

周期色

赤節
柿慈織 藤知織 桜孝織
12 1234 1
345678 5678910 234567
91011121314 111213141516 8910111213
151617181920 171819202122 141516171819
212223242526 2324252627 202122232425
2728 262728
緑喜織 榴色織 赤夢織
123 123456 12
456789 789101112 345678
101112131415 131415161718 91011121314
161718192021 192021222324 151617181920
222324252627 25262728 212223242526
27
朱倹織 草仁織 黄友織
12345 1 1234
67891011 234567 5678910
121314151617 8910111213 111213141516
181920212223 141516171819 171819202122
2425262728 202122232425 2324252627
2627
虹怒織 銀声織 鼠幻織
1 123 123456
234567 456789 789101112
8910111213 101112131415 131415161718
141516171819 161718192021 192021222324
202122232425 222324252627 25262728
262728
緑節
鉛勤織 紫聖織 藍睦織
金哀織 翠香織 珠泡織
丹慎織 灰義織 茜姻織
黒楽織 桃味織 菫影織
青節
茶誠織 青忠織 銅任織
橙愛織 煤触織 狐露織
紅明織 瑪和織 碧恤織
白悪織 鶯法織 空雷織
― 新着の感想 ―
このエピソードに感想はまだ書かれていません。
感想一覧
+注意+

特に記載なき場合、掲載されている作品はすべてフィクションであり実在の人物・団体等とは一切関係ありません。
特に記載なき場合、掲載されている作品の著作権は作者にあります(一部作品除く)。
作者以外の方による作品の引用を超える無断転載は禁止しており、行った場合、著作権法の違反となります。

この作品はリンクフリーです。ご自由にリンク(紹介)してください。
この作品はスマートフォン対応です。スマートフォンかパソコンかを自動で判別し、適切なページを表示します。

↑ページトップへ