HTML5/CSS3デザインテンプレート

この箇所はホームページの説明文など記載するのに最適です。だいたい2~3行程度で収めるのがよいかと思います。

サンプルタグについて

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

INFORMATION

20XX-01-01
更新情報などを掲載するのに便利なデザインです。dlタグに『class="information"』を追加してください。
20XX-01-01
更新情報などを掲載するのに便利なデザインです。

h2タグ

h3タグ

h4タグ

h5タグ
h6タグ

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

引用部分です。引用部分です。引用部分です。引用部分です。引用部分です。引用部分です。引用部分です。引用部分です。引用部分です。引用部分です。引用部分です。引用部分です。

リスト

普通のリスト

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

番号付きリスト

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

デザインリスト

このようにリストマークを星形にしたい場合は、ulタグに『class="list"』を追記してください。

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

定義リスト

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

テーブル

見出し1
見出し1
見出し2見出し3見出し4見出し5
セル1
セル1
セル2セル3セル4セル5
セル1セル2セル3セル4セル5
セル1セル2セル3セル4セル5
見出し1セル1
セル1
セル2セル3セル4セル5
見出し2
見出し2
セル1セル2セル3セル4セル5
見出し3セル1セル2セル3セル4セル5
見出し4セル1セル2セル3セル4セル5
見出し5セル1セル2セル3セル4セル5

写真

imgタグをdivで囲んで、divに『class="photo"』と追記してください。ふんわりした枠で囲まれるようになります。

フォトサンプル
ページのトップへ戻る