Japanese02

///////

和柄の七宝をアレンジした、ふんわり可愛い雰囲気の、1カラムテンプレートです。
メニューをアルファベットにしているのであまり和風に見えませんが、漢字にすると、ちょっと和風になります。
(本当は漢字で「案内」とかにしたかったけど、センスなくてうまく置換できなかった・・・)
ロゴを入れる場合は、サイト名の部分に画像を挿入してください。

ご依頼より、キャラクターのプロフィールを展示するサイトになっています。
キャラクター一覧は、文字のみとサムネイルの2種類。
プロフィールページは、画像を消したりサイズを変えたり、項目を増減させても大きくレイアウトが崩れることはありません。

レスポンシブデザインになっていますので、ブラウザの横幅が小さくなると、スマホ用の表示に切り替わります。
単純に、ブラウザの横幅を狭めても確認はできますが、
GoogleChromeをお使いの方は、ブラウザ上右クリック→検証→上部のスマホ・タブレットのアイコン(Toggle device toolber)をクリックすると、モバイル用のレイアウトを確認できます。

ご注意

利用規約に同意の上、ご利用ください。

使い方

downloadボタンをクリックすると、zipファイルがダウンロードされます。

zipファイル内は、下記のファイルで構成されています。

   
ファイル名 内容
img 画像フォルダ。使用している画像はすべてここに入っています。
css
reset.css style.css

reset.cssは編集不要。
style.cssでデザインをすべて行っています。
デザインを編集したい場合はこのファイルを編集してください。
index.html 最初の画面。
main.html キャラクター一覧のページ。別の用途でご使用の場合はご自由に変更ください。
chara.html キャラクタープロフィールのページ。
sample.html 見出しなどのサンプルを載せています。
link.html リンク集のページ。
mail.html メールフォーム。

以下の部分を編集してください。

  1. <head></head>の中 <title>サイト名~<title>の部分
  2. <body></body>の中 <!-- ヘッダー --> <!-- メニュー --> <!-- コンテンツ --> <!-- フッター -->の記載の下に、
    それぞれの内容が記載されてありますので、必要に応じて編集してください。
  3. <footer></footer>の中サイト名等の部分

ヘッダー、メニュー、フッターの編集は、すべてのHTMLファイルで同じ編集が必要です。

動作確認環境

OS
Windows10
ブラウザ
Chrome(最新バージョン)
解像度
1920 x 1080

※IE非対応です

DOWNLOAD DEMO
このテンプレートがスキ!
いいねボタン
スポンサーリンク