1カラムのレスポンシブ Web デザイン
スマートフォン、タブレット、パソコンでの閲覧に対応した、レスポンシブ Web デザインの無料テンプレートです。
HTML5 と CSS3 で制作しました。
2013/3/18
Internet Explorer 6 用に、HTML と CSS を一部更新しました。
Internet Explorer 8 以下に HTML5 と Media Queries を認識させるには、無料テンプレートのカスタマイズを行なって下さい。
Free Template 5 をダウンロード（zip 形式）
斜線テクスチャの灰色でデザインした無料テンプレートです。
編集しやすい 1 カラムレイアウトです。
タイトルやメニューがテキストなので、画像を編集する手間がありません。
Free Template 4 をダウンロード（zip 形式）
斜線テクスチャの紫色でデザインした無料テンプレートです。
同じく 1 カラムレイアウトです。
スポンサーリンク
Free Template 3 をダウンロード（zip 形式）
斜線テクスチャの青色でデザインした無料テンプレートです。
同じく 1 カラムレイアウトです。
Free Template 2 をダウンロード（zip 形式）
ファイバーテクスチャの赤色でデザインした無料テンプレートです。
同じく 1 カラムレイアウトです。
Free Template 1 をダウンロード（zip 形式）
ファイバーテクスチャの青色でデザインした無料テンプレートです。
同じく 1 カラムレイアウトです。
ブラウザの幅を狭めると、レイアウトが切り替わります。
編集が必要な箇所に画像を使用していないので、テキストの編集のみでウェブサイトをオープンできます。
テクスチャを入れ替えれば、テンプレートのカラーを変更できます。
テクスチャをダウンロードしたら、使用したいテクスチャを images フォルダに移動して下さい。
次に、メモ帳などで style.css を開きます。
images/テクスチャ名.png の部分の、テクスチャ名を変更して保存します。
ブラウザでテンプレートを開くと、テクスチャが入れ替わったことを確認できます。
コメント（/* ～ */ の部分）には説明が記載してあるので、カスタマイズの参考にして下さい。
テクスチャは、全体の背景／ヘッダーの背景／メニューの背景／フッターの背景に使用しました。
ヘッダーやリンクの文字色を設定する行にもコメントを記載しました。
テクスチャのカラーに合わせて、文字色のカラーコードを編集して下さい。
当サイトの無料テンプレートがお役に立ちましたら幸いです。
スポンサーリンク