制作者より

カフェなどの飲食店に最適なCSSデザインテンプレートです。

カフェやコーヒー店なら、比較的落ち着いた色味が合いますね。特に茶系だとナチュラル感が出ますし、濃い茶色であれば落ち着いた感じが出ます。

今回は本当の意味でのインデックスページ(入り口ページ)を作ってみました。店舗などによってインデックスに出したい情報って違うと思うのでいろいろカスタマイズしてみてください。

完全幅固定タイプです。
全体的な横幅は780px、メインコンテンツ部分540px(余白除く)、サブコンテンツ部分220px(余白除く)です。サブコンテンツ部分はメニューやバナー等を配置することを想定し、幅を広く取りました。


サンプル画像について

写真は足成様[カフェの店内 (写真素材 足成)][豚キムチライス (写真素材 足成)][カフェー (写真素材 足成)]からお借りしました。

サンプルについて

以下、サンプルタグになります。ご利用の際は参考にしてみてください。

INFORMATION

2010-01-05
14:00~16:00の間、ケーキセットをご注文いただいた方は、10%OFFのキャンペーンを行っています。1月30日までです。詳細はこちらから。
2010-01-04
新年明けましておめでとうございます。今年もカフェ ゆるらぎを宜しくおねがいいたします。
2009-12-18
誠に勝手ながら12月28日~1月3日まで年末年始の休業日とさせていただきます。年始のオープンは1月4日10:00からです。
2009-12-12
新メニュー登場です!「さっぱりお酢の鶏丼」です。本日から18日まで、ご注文された方はサラダバーが無料です。
2009-12-08
12月7日に帽子の忘れ物がございました。心当たりのある方は、XXX-XXX-XXXまでご連絡ください。

タグサンプル

h3タグ

h4タグ

h5タグ
h6タグ

強調(em) より強い強調(strong) 追加(ins) 削除(del)
テキストアンカー

リスト

普通のリスト

  • 普通のリスト1
  • 普通のリスト2
  • 普通のリスト3

番号付きリスト

  1. 番号付きリスト1
  2. 番号付きリスト2
  3. 番号付きリスト3
    li要素の中はブロックレベルのタグを使用することが出来ます。例えば、<p>タグも記述することが出来ます。

定義リスト

定義リスト1
定義した用語の説明
定義リスト2
定義した用語の説明
定義リスト3
定義した用語の説明
dd要素の中はブロックレベルのタグを使用することが出来ます。例えば、<p>タグも記述することが出来ます。しかし、dt要素にはインライン要素しか記述することができません。