おまけのテキスト装飾のテストを兼ねた解説です。
昔配布したデザインがスマホからだと崩れていたので、直すついでにHTML5に移行しました。といってもできる範囲でやっただけなのでコード的にはたぶんあまり美しくはないです。
デザインを使う場合はHEADもコピーしてください。
ページの現在地をあらわす付箋を手前にするには、<nav>で挟まれたメニューのリンクタグのうち、手前に表示したいリンクを、<a href="リンク先のURL" class="active">リンク文字</a>という風にしてください。
それから、ルーズリーフの内容はある程度書かないと付箋だけ下に飛び出て崩れます。上記のデザインの場合、見出しを含め十二行くらい書けば崩れないと思います。
デザインの中の色の指定は基本的にHEAD内で行っています。説明書きを入れておくので、読んでみて触ってみてください。自分でうまく作れないけど色違いがどうしても欲しい場合は私に連絡してください。どうにかします。
確認はGoogle ChromeとFirefoxとiPhoneSEです。
このテンプレートで何かありましたら、ID capricioussxl までお願いします。