h3（見出し）を使うとこうなります。

ここにテキストを入力していきます。
ここにテキストを入力していきます。ここにテキストを入力していきます。
ここにテキストを入力していきます。
ここにテキストを入力していきます。ここにテキストを入力していきます。

更新情報の場合はこう使ってください。

• 2009/11/05
  この最新情報の欄には、サイトの更
  新情報を書き込んでください
• 2009/11/05
  この最新情報の欄には、サイトの更
  新情報を書き込んでください
• 2009/11/05
  この最新情報の欄には、サイトの更
  新情報を書き込んでください
• 2009/11/05
  この最新情報の欄には、サイトの更
  新情報を書き込んでください
• 更新情報はRSSでも配信しております。

画像の回り込みの例（画像が左、テキストが右）

画像を回り込ま
せたい時には、<img class=”right” />で画像を囲めば、画像が右、テキストが左の配置
が可能です。
rightをleftにすれば、画像が左、テキストが右にできます。
画像よりテキストが長くなれば、必然的に画像のしたに回り込むような設定になっていま
す。
画像よりテキストが長くなれば、必然的に画像のしたに回り込むような設定になっていま
す。
画像よりテキストが長くなれば、必然的に画像のしたに回り込むような設定になっていま
す。

画像の回り込みの例（画像が右、テキストが左）

画像を回り込ま
せたい時には、<img class=”right” />で画像を囲めば、画像が右、テキストが左の配置
が可能です。
rightをleftにすれば、画像が左、テキストが右にできます。
画像よりテキストが長くなれば、必然的に画像のしたに回り込むような設定になっていま
す。
画像よりテキストが長くなれば、必然的に画像のしたに回り込むような設定になっていま
す。
画像よりテキストが長くなれば、必然的に画像のしたに回り込むような設定になっていま
す。

どこかから引用する場合

ここに引用の文章を入れましょう。
引用なのでそのまま引用してくださいね。

引用元：サイト名などを入れましょう。

その後は普通にこうやってテキストもかけます。
引用に対する意見なども書くこともできます。

定義タグ（dl、dt、dd）

定義タグを使った例です。
dlで囲って、定義をdtで囲い、その説明をddで記載します。

定義の見出し

定義の説明を書きましょう。dtにまつわることを書いたりしていきます。

リンクを入れる場合はこのように。

画像を使いたい場合

まず画像に、class=”left”を与えます。そして、次は普通にテキストを入力して、最後に
「dl」にclass=”clearfix”を与えます。clearfixは、floatを使った際の回りこみ解除の役割を
果たします。

画像を使ってもリンクは入れれます。

チェックリストしよう（ulとli、olとli）

ここではチェックリストの使い方です。
ulで囲って、それぞれ li を使ってリスト化していきます。

• リスト１リスト１リスト１リスト１リスト１リスト１リスト１リスト１リスト１リス
  ト１リスト１リスト１リスト１リスト１リスト１
• リスト２
• リスト３
• リスト４
• リスト５
• リスト中にもリンクは設定できます。

テーブルタグを使う場合

テーブルタグを使う場合は以下のように使ってください。
tableで囲って、trが行です。thはその中でも見出しの役割を果たし、tdがそれぞれの列を
成します。

テーブル内の各サイズは、必要な分だけ計算して入力してください。

その他、文字の装飾などについて

使える文字のカラー

それぞれ使える文字のカラー一覧。

赤色の文字
青色の文字
緑色の文字
黄色の文字
紺色の文字
黒色の文字
灰色の文字
紫色の文字
桃色の文字
橙色の文字
白色の文字
白色や黄色は、下にあるように背景付けて使いましょう

使える文字の背景カラー

使える文字の背景色一覧(文字は白で統一）

赤色の背景
青色の背景
緑色の背景
黄色の背景
紺色の背景
黒色の背景
灰色の背景
紫色の背景
桃色の背景
橙色の背景
白色の背景

文字のサイズの指定

使える文字のサイズ指定の一覧

90%の文字
100%の文字
110%の文字
120%の文字
130%の文字
140%の文字
150%の文字
160%の文字
170%の文字
180%の文字
190%の文字
200%の文字

テキストの装飾

打消し線や下線など装飾について

下線を引きます。
打ち消し線を引きます。

テキストの位置指定

右寄せや中央揃えなどの位置について

左寄せ

中央揃え

右寄せ

口コミの使い方

口コミの使い方～

ランキングの使い方

見出し

本文ここから

【ジャンル】　：ブログ
【対象者】　：初心者～
【価格】　：9,800円

「教材名をここに記入」の販売ページはこちら

（教材名）概要

この（教材名）の簡単な概要・・・
サンプル
サンプル

詳細レビュー評価、感想

ここに教材の詳細レビュー評価、感想を記入
サンプル
サンプル

構成、目次

教材の目次や構成等をここに記載

1. サンプル
2. サンプル

• サンプル
• サンプル

（教材名）購入ページ

【教材名】　：教材タイトル　
【総合レビュー評価】　９５点　

【ジャンル】　：ブログ
【対象者】　：初心者～
【価格】　：9,800円

「教材名をここに記入」の販売ページはこちら

＜▼渡せる特典がまだない場合はここから削除▼＞

（教材名）特典案内

当サイトよりご購入頂けました方に以下の豪華特典をお渡ししております。

＜▼限定特典がない場合は削除～ここから～▼＞

（教材名）限定特典

（商材名）特典1☆　特典タイトル

（商材名）特典2☆　特典タイトル

/images/sample/sample5.png” alt=”商品イメージ画像” title=”画像のタイトル” width=”230″ height=”155″ class=”alignleft” />【教材名】　：教材タイトル　 【総合レビュー評価】　９５点　 【ジャンル】　：ブログ 【対象者】　：初心者～ 【価格】　：9,800円 「教材名をここに記入」の販売ページはこちら ＜▲渡せる特典がまだない場合はここから削除▲＞ ]]> http://melon461.net/40/34.html/feed 0 http://melon461.net/40/33.html http://melon461.net/40/33.html#comments Sat, 16 Oct 2010 01:47:28 +0000 admin http://tukasai.xsrv.jp/ts2/?p=15 【教材名】　：サンプル教材　 【総合レビュー評価】　８０点　 【ジャンル】　：ブログ 【対象者】　：初心者～ 【価格】　：１9,800円 「教材名をここに記入」の販売ページはこちら （教材名）概要 この（教材名）の簡単な概要・・・ サンプル サンプル 詳細レビュー評価、感想 ここに教材の詳細レビュー評価、感想を記入 サンプル サンプル 構成、目次 教材の目次や構成等をここに記載 ■サンプル 　・サンプル 　・サンプル ■サンプル 　・サンプル 　・サンプル （教材名）購入ページ 【教材名】　：教材タイトル　 【総合レビュー評価】　９５点　 【ジャンル】　：ブログ 【対象者】　：初心者～ 【価格】　：9,800円 「教材名をここに記入」の販売ページはこちら ＜▼渡せる特典がまだない場合はここから削除▼＞ （教材名）特典案内 当サイトよりご購入頂けました方に以下の豪華特典をお渡ししております。 ＜▼限定特典がない場合は削除～ここから～▼＞ （教材名）限定特典 （商材名）特典1☆　特典タイトル （商材名）特典2☆　特典タイトル /images/sample/sample5.png” alt=”商品イメージ画像” title=”画像のタイトル” width=”230″ height=”155″ class=”alignleft” />【教材名】　：教材タイトル　 【総合レビュー評価】　９５点　 【ジャンル】　：ブログ 【対象者】　：初心者～ 【価格】　：9,800円 「教材名をここに記入」の販売ページはこちら ＜▲渡せる特典がまだない場合はここから削除▲＞ ]]> http://melon461.net/40/33.html/feed 0 http://melon461.net/40/32.html http://melon461.net/40/32.html#comments Sat, 16 Oct 2010 01:46:37 +0000 admin http://tukasai.xsrv.jp/ts2/?p=13 この投稿はパスワードで保護されています。表示するにはパスワードを入力してください: パスワード ]]> http://melon461.net/40/32.html/feed 0 http://melon461.net/40/31.html http://melon461.net/40/31.html#comments Sat, 16 Oct 2010 01:39:52 +0000 admin http://tukasai.xsrv.jp/ts2/?p=10 この投稿はパスワードで保護されています。表示するにはパスワードを入力してください: パスワード ]]> http://melon461.net/40/31.html/feed 0 http://melon461.net/40/30.html http://melon461.net/40/30.html#comments Sat, 16 Oct 2010 01:35:57 +0000 admin http://tukasai.xsrv.jp/ts2/?p=8 本テンプレートで使用できる素材の一覧ページです！あくまでもサイト運営者に対するサンプルページですのでサイト公開時には「下書き」で保存しなおしてください＾＾ 素材サンプル一覧ページ チェックリスト素材１ チェックリスト素材１ <p class=" icon1">チェックリスト素材１</p> <p class=" icon1">チェックリスト素材１</p> チェックリスト素材２ チェックリスト素材２ チェックリスト素材２ チェックリスト素材２ <ul> <li>チェックリスト素材２</li> <li>チェックリスト素材２</li> <li>チェックリスト素材２</li> <li>チェックリスト素材２</li> </ul> メールアイコン <p class="mail"><a href="ここにメールフォームURLを記入">メールアイコン</a></p> ビックリマーク <p class="iconb">ビックリマーク</p> リンクセンター表示 <p class="link"><a href="http://ここにＵＲＬを記入">リンクセンター表示</a></p> リンク左位置表示 <p class="link2"><a href="http://ここにＵＲＬを記入">リンク左位置表示</a></p> リンク右位置表示 <p class="link3"><a href="http://ここにＵＲＬを記入">リンク右位置表示</a></p> 引用文などを記載する場合など枠と背景色をつける時などに使用 <blockquote> 引用文などを記載する場合など枠と背景色をつける時などに使用 </blockquote> h2見出しタイトル <h2>h2見出しタイトル</h2> h3見出しタイトル <h3>h3見出しタイトル</h3> h4見出しタイトル <h4>h4見出しタイトル</h4> h5見出しタイトル <h5>h5見出しタイトル</h5> h6見出しタイトル <h6>h6見出しタイトル</h6> ]]> http://melon461.net/40/30.html/feed 0 http://melon461.net/40/29.html http://melon461.net/40/29.html#comments Sat, 16 Oct 2010 01:34:13 +0000 admin http://tukasai.xsrv.jp/ts2/?p=5 本テンプレートで使用できる文字装飾一覧ページサンプルです！あくまでもサイト運営者に対するサンプルページですのでサイト公開時には「下書き」で保存しなおしてください＾＾ 文字装飾一覧サンプル 文字の装飾はクラス指定で行います＾＾ 例：<p class="ここに指定">テキスト</p> 例：<span class="ここに指定">テキスト</span> Pタグは改行時にスペースが空きますので1行全てを装飾する場合に使用 文中の一部に装飾を行いたい場合はspanタグを使用すると良いですね＾＾ ＊そのままコピペで使用いただけます。 フォントサイズ <p class="font-12"></p> <p class="font-14"></p> <p class="font-16"></p> <p class="font-18"></p> <p class="font-20"></p> <p class="font-22"></p> <p class="font-24"></p> <p class="font-26"></p> <p class="font-28"></p> <p class="font-30"></p> フォントカラー <p class="light-brown"></p> <p class="dark-brown"></p> <p class="light-red"></p> <p class="dark-red"></p> <p class="light-pink"></p> <p class="dark-pink"></p> <p class="light-orange"></p> <p class="dark-orange"></p> <p class="light-green"></p> <p class="dark-green"></p> <p class="light-blue"></p> <p class="dark-blue"></p> <p class="light-purple"></p> <p class="dark-purple"></p> 太文字 <p class="strong"></p> 蛍光ペン : 黄 テキストに背景色を付ける場合はPタグを使用するとその1行全てに反映される為＜span＞タグを使用 <span class="keikou"></span> 装飾を組み合わせる フォントサイズとフォントカラーを組み合わせて使用する場合は半角スペースを入れる。 <p class="font-16 dark-purple"></p> <p class="font-16 dark-blue"></p> <p class="font-16 dark-purple strong"></p> <p class="font-16 dark-blue strong"></p> <span class="font-16 dark-purple strong keikou"></span> <span class="font-16 dark-blue strong keikou"></span> ]]> http://melon461.net/40/29.html/feed 0