私たちは融けるのだろうか

はじまり
第一章
第二章

ねむ様ー！こんな感じでいかがでしょうか。どろどろ爽やかをイメージして作りました。
横並びにしようかとも思ったんですが、縦のほうがかっこいいかなと。

背景の色は好きに変えてください。「はじまり」を押すと目次画面が表示され、或恋愛物語というタイトルを押すと文章画面が表示されます。ぜひ見てみてください。
あとがきも付けましたが、いちいち＜div class="ato"＞〜＜/div＞の間に書き込む形になります…。すみません。

表紙・目次は＃を全角にして配布しておりますが、使用する際は半角にしてください。
幅は600pxで設定しています。

素材↓


HEAD
<style type="text/css"> @media screen and (min-width: 600px){#all{width: 600px; margin: 0px auto;}} body{margin:0% 5% 5% 5%; padding:0% 5% 5% 5%; font-size: 13px; line-height:2; background-color:#D7EEFF; background-image:url(#画像URL#); background-repeat:no-repeat; background-attachment: fixed; background-position:center top; color:#111; font-family:'Lucida Grande','Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3',Meiryo, メイリオ, sans-serif;} p{color:#fff; font-size:15px; text-shadow:1px 1px 3px #280DC1;} .waku{color:#000; background:#D7EEFF; box-shadow:10px 10px 20px #D7EEFF,-10px 10px 20px #D7EEFF,10px -10px 20px #D7EEFF,-10px -10px 20px #D7EEFF; opacity:0.9;} .ato{color:#fff; background:#DDA0DD; opacity:0.8; padding:20px;} a {text-decoration: none; color:#C71585;} a:hover {color:#fff; border-bottom:#280DC1 dotted 1px} a:visited{color:#aaa;}</style>

全体レイアウト <div id="all">#novel#</div>

表紙画面 <center><br><p>私たちは融けるのだろうか</p><br><br><div class="waku">＃list＃</div></center>

目次画面 <center><br><p>私たちは融けるのだろうか</p><br><br><br><div class="waku">＃list＃</div></center>

文章画面 <center><br><p>#title#</p></center><br><br><br><div class="waku">#text#</div><br><br><center>≪ ≫</center>

- ナノ -