文型
文型
美容院向けのCSSデザインテンプレートです。限りなくシンプルに仕上げているので、｢スタイリッシュ｣｢シンプル｣｢クール｣というようなイメージを持たせたいWebサイトに最適です。
CSS3のプロパティをたくさん使おうと思っていたのですが、テンプレートを囲んでいる枠しか使っていません。FirefoxやSafari、Chromeではテンプレートにシャドウのかかった枠が表示されますが、その他のブラウザでは枠は表示されません。
一応、IE、Firefox、Safari、Chrome、Operaのブラウザで枠が表示されるように修正しました。IEは｢box-shadow｣というCSSプロパティは実装されていないのですが、｢PIE.htc｣というスクリプトファイルをCSSで読み込ませることによってCSS3のプロパティでも実装されるようになります。
｢PIE.htc｣については以下のWebサイトをご参考ください。（英語のサイトです。）
CSS3 PIE: CSS3 decorations for IE
完全幅固定タイプです。
全体的な横幅は800px、メインコンテンツ部分540px（余白除く）、サブコンテンツ部分220px（余白除く）です。サブコンテンツ部分はメニューやバナー等を配置することを想定し、幅を広く取りました。
実装について
以下の実装をしています。
- スムーススクロール
- ドロップダウンメニュー
スムーススクロールの採用
ページのトップへ戻るリンクにはJavaScriptを用い、スムースに上部へ戻るようにしております。また、ページ内リンクでも同様の効果を得ることができます。こちらは特に何も変更する必要はありません。
ドロップダウンメニューの採用
ヘッダーのメニューは、ドロップダウンメニューを採用しています。｢メニュー・料金｣｢ヘアカタログ｣にカーソルを当てると、下にサブメニューが現れる仕組みです。
カスタマイズについて
カスタマイズはご自由になさってください。
制限はありません。
その他、不具合などございましたら
CoolWebWindowにお知らせください。
以下、サンプルタグになります。ご利用の際は参考にしてみてください。
- 2009-04-28
-
○○新聞に取材を受けました。
- 2009-04-24
-
休業のお知らせ。誠に勝手ながら5月2日から6日まで長期休暇日とさせていただきます。ご了承ください。
h3タグ
h4タグ
h5タグ
h6タグ
強調（em） より強い強調（strong） 追加（ins） 削除（del）
テキストアンカー
リスト
普通のリスト
- 普通のリスト1
- 普通のリスト2
- 普通のリスト3
番号付きリスト
- 番号付きリスト1
- 番号付きリスト2
- 番号付きリスト3
li要素の中はブロックレベルのタグを使用することが出来ます。例えば、<p>タグも記述することが出来ます。
定義リスト
- 定義リスト1
- 定義した用語の説明
- 定義リスト2
- 定義した用語の説明
- 定義リスト3
- 定義した用語の説明
dd要素の中はブロックレベルのタグを使用することが出来ます。例えば、<p>タグも記述することが出来ます。しかし、dt要素にはインライン要素しか記述することができません。
テーブル
| 見出し1 | 見出し2 | 見出し3 | 見出し4 | 見出し5 |
|---|---|---|---|---|
| セル1 | セル2 | セル3 | セル4 | セル5 |
| セル1 | セル2 | セル3 | セル4 | セル5 |
| セル1 | セル2 | セル3 | セル4 | セル5 |