小説本文(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>