夢十夜

夏目漱石

夢十夜

夏目漱石

夢十夜

夏目漱石

夢十夜

夏目漱石

夢十夜

夏目漱石

夢十夜

夏目漱石

誰がために鐘は鳴る

アーネスト・ヘミングウェイ

誰がために鐘は鳴る

アーネスト・ヘミングウェイ

誰がために鐘は鳴るアーネスト・ヘミングウェイ誰がために鐘は鳴るアーネスト・ヘミングウェイ誰がために鐘は鳴るアーネスト・ヘミングウェイ

アーネスト・ヘミングウェイ誰がために鐘は鳴るアーネスト・ヘミングウェイ

誰がために鐘は鳴るアーネスト・ヘミングウェイ誰がために鐘は鳴るアーネスト・ヘミングウェイ誰がために鐘は鳴るアーネスト・ヘミングウェイ

アーネスト・ヘミングウェイ誰がために鐘は鳴るアーネスト・ヘミングウェイ


小説本文(flat-designシリーズ)の小説メニューデザインです。
使いやすいようにカスタマイズして下さい。サポートはしていません。
PC/タブレット/スマホ向け、ガラケー未確認です。ブラウザによるデザイン崩れは想定していません。
メディアクエリ使用しています(1024px)。

使用したアイコンはフォントです。
オープンソースのWEB ICON「WE LOVE ICON FONTS」を使用しています。アイコンの変更など使用方法はサイトでお調べ下さい。英語サイトですがとても分かりやすいです。※ホスティングサーバーにアクセスが集中した場合アイコンが表示されないことが”極稀に”あります。

サンプルのアイコンリンクはダミーです。
<a>タグになっていますので、機能の独自タグによるリンクを使いたい方は、
#page1_<span class="fontawesome-reply"></span>ホーム#

#prev_<span class="fontawesome-angle-left"></span>戻る_<span class="fontawesome-angle-left"></span>戻る#

のように、<span>〜</span>も入力して下さい。
これで独自タグでもアイコン付きになります。※実際の独自タグの#は小文字です。

上部はグラデーションCSSです。デフォルトではサンプルの3パターンを用意しています。
長い文字は要素の幅で省略されます(サンプルの一番下参考)。

下の2パターンを<#list#>にする場合の例(2つ目のデザインです)
タイトルの左に
<div id="pagetitle2"><h1 class="g3"></h1><h2>

タイトルの右に
</h2><h3>ほげほげ</h3></div>


アクセス制限機能充実
夢小説のDLove
- ナノ -