satsukiテンプレート

デフォルトのテンプレートである、satsukiテンプレートのHTML構造とルールについて解説します。

  • はてなテーマも利用可能なように作成してあるため、クラス構造がやや煩雑になっています。
  • IEでのデザイン自由度を増やすため、通常は無用な空<div>がいくつも配置されています(汗)*1
  <div class="side-a">
    <div class="side-a-top"></div>
    <div class="side-a2">
     (サイドバー前半)
    </div>
    <div class="side-a-bottom"></div>
  </div> <!-- End of side-a2/side-a -->

  <div class="side-b">
    <div class="side-b-top"></div>
    <div class="side-b2">
     (サイドバー後半)
    </div>
    <div class="side-b-bottom"></div>
  </div> <!-- End of side-b2/side-b -->

*1 : IE以外ではbefore, after擬似要素で対応可能。