HOME > 左サイドバーの無料テンプレート一覧

左サイドバーの無料テンプレート一覧

左サイドバーのテンプレートは、HTMLソース上、コンテンツ部分をサイドバーよりも先に読み込ませることをおすすめします。

レスポンシブウェブデザインでスマートフォンに対応する際、CSSで指定したfloatを解除してワンカラムで表示しますので、サイドバーから先に読み込ませると、スマホで閲覧した際、サイドバーが上部に表示されてしまい見ずらくなってしまいます。

なので、左サイドバーのテンプレートを作成する際は、HTMLソース上、コンテンツ部分から先に読み込ませ、floatでコンテンツ部分を右へ、サイドバー部分を左へ寄せるようにするとよいでしょう。


こちらは2コラム左サイドバーのテンプレートです。
htmlのファイル名を「index.html」として、文字コードは「 utf-8 」で保存してください。また、スタイルシートは「style.css」として保存してください。
Number.001


こちらも2コラム・左サイドバーのテンプレートです。
htmlのファイル名を「index.html」として、文字コードは「 utf-8 」で保存してください。スタイルシートは「index.css」として保存してください。
Number.007


■その他

右サイドバーのテンプレートはこちら。
2コラム・右サイドバー一覧

シンプルなテンプレートはこちら。
1コラム・シンプル一覧

使用方法やカスタマイズ方法についてはこちら。
無料テンプレートの使用方法


HOME >