サンプルページ

見出し2 サンプル

テキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキスト

見出し3 サンプル

テキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキスト

見出し4 サンプル

テキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキスト

見出し5 サンプル

テキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキスト

---

テキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキスト

テキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキスト

インライン要素 左寄せ

インライン要素 右寄せ

インライン要素 右寄せ

強調テキスト

太字テキスト

[html] <hr /> <p class="color_green">テキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキスト</p> <p class="color_red">テキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキスト</p> <p class="align_left">インライン要素 左寄せ</p> <p class="align_center">インライン要素 右寄せ</p> <p class="align_right">インライン要素 右寄せ</p> <p><strong>強調テキスト</strong></p> <p><b>太字テキスト</b></p> [/html]

カラーボックス

[html] <div class="box_color"> <p>テキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキスト</p> </div> [/html] [html] <div class="box_color_success"> <p>テキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキスト</p> </div> [/html]

リスト

• 順不同リスト
• 順不同リスト
  • 順不同リスト
  • 順不同リスト
  • 順不同リスト
• 順不同リスト
• 順不同リスト

[html] <ul> <li>順不同リスト</li> <li>順不同リスト <ul> <li>順不同リスト</li> <li>順不同リスト</li> <li>順不同リスト</li> </ul> </li> <li>順不同リスト</li> <li>順不同リスト</li> </ul> [/html]

---

1. 番号付きリスト
2. 番号付きリスト
3. 番号付きリスト
4. 番号付きリスト
   1. 番号付きリスト
   2. 番号付きリスト
   3. 番号付きリスト
5. 番号付きリスト
6. 番号付きリスト
7. 番号付きリスト
8. 番号付きリスト
9. 番号付きリスト
10. 番号付きリスト
11. 番号付きリスト

[html] <ol> <li>番号付きリスト</li> <li>番号付きリスト</li> <li>番号付きリスト</li> <li>番号付きリスト <ol> <li>番号付きリスト</li> <li>番号付きリスト</li> <li>番号付きリスト</li> </ol> </li> <li>番号付きリスト</li> <li>番号付きリスト</li> <li>番号付きリスト</li> <li>番号付きリスト</li> <li>番号付きリスト</li> <li>番号付きリスト</li> <li>番号付きリスト</li> </ol> [/html]

---

• 丸付きリスト
• 丸付きリスト
  
  • 丸付きリスト
  • 丸付きリスト
  • 丸付きリスト
• 丸付きリスト
• 丸付きリスト

[html] <ul class="list_disc"> <li>丸付きリスト</li> <li>丸付きリスト <ul class="list_disc"> <li>丸付きリスト</li> <li>丸付きリスト</li> <li>丸付きリスト</li> </ul> </li> <li>丸付きリスト</li> <li>丸付きリスト</li> </ul> [/html]

---

• チェック付きリスト
• チェック付きリスト
  
  • チェック付きリスト
  • チェック付きリスト
  • チェック付きリスト
• チェック付きリスト
• チェック付きリスト

[html] <ul class="list_check"> <li>チェック付きリスト</li> <li>チェック付きリスト <ul class="list_check"> <li>チェック付きリスト</li> <li>チェック付きリスト</li> <li>チェック付きリスト</li> </ul> </li> <li>チェック付きリスト</li> <li>チェック付きリスト</li> </ul> [/html]

---

• 余白付きリスト
• 余白付きリスト
  • 余白付きリスト
  • 余白付きリスト
  • 余白付きリスト
• 余白付きリスト
• 余白付きリスト

[html] <ul class="list_l"> <li>余白付きリスト</li> <li>余白付きリスト <ul> <li>余白付きリスト</li> <li>余白付きリスト</li> <li>余白付きリスト</li> </ul> </li> <li>余白付きリスト</li> <li>余白付きリスト</li> </ul> [/html]

テーブル

見出し	テキスト
見出し	テキスト
見出し	テキスト

見出し	見出し	見出し
テキスト	テキストテキスト	テキスト
テキスト	テキストテキスト	テキスト
テキスト	テキストテキスト	テキスト

見出し	テキストテキストテキストテキストテキストテキスト
見出し	テキストテキストテキストテキストテキストテキスト
見出し	テキストテキストテキストテキストテキストテキスト
見出し	テキストテキストテキストテキストテキストテキスト

見出し	見出し	見出し	見出し
テキストテキスト	テキスト	テキストテキスト	テキスト

[html] <table class="tbl_std"> <tr> <th>見出し</th> <td>テキスト</td> </tr> <tr> <th>見出し</th> <td>テキスト</td> </tr> <tr> <th>見出し</th> <td>テキスト</td> </tr> </table> <table> <thead> <tr> <th>見出し</th> <th>見出し</th> <th>見出し</th> </tr> </thead> <tbody> <tr> <td>テキスト</td> <td>テキストテキスト</td> <td>テキスト</td> </tr> <tr> <td>テキスト</td> <td>テキストテキスト</td> <td>テキスト</td> </tr> <tr> <td>テキスト</td> <td>テキストテキスト</td> <td>テキスト</td> </tr> </tbody> </table> <table class="tbl_std tbl_underline"> <tr> <th>見出し</th> <td>テキストテキストテキストテキストテキストテキスト</td> </tr> <tr> <th>見出し</th> <td>テキストテキストテキストテキストテキストテキスト</td> </tr> <tr> <th>見出し</th> <td>テキストテキストテキストテキストテキストテキスト</td> </tr> <tr> <th>見出し</th> <td>テキストテキストテキストテキストテキストテキスト</td> </tr> </table> <table class="tbl_fixed"> <thead> <tr> <th>見出し</th> <th>見出し</th> <th>見出し</th> <th>見出し</th> </tr> </thead> <tbody> <tr> <td>テキストテキスト</td> <td>テキスト</td> <td>テキストテキスト</td> <td>テキスト</td> </tr> </tbody> </table> [/html]

レイアウト

[html] <div class="box"> <div class="box_left"><img src="/shared/img/common/img_sample.png" width="250" alt="sample" /></div> <div class="box_text"> <p>テキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキスト</p> </div> </div> [/html] [html] <div class="box"> <div class="box_right"><img src="/shared/img/common/img_sample.png" width="250" alt="sample" /></div> <div class="box_text"> <p>テキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキスト</p> </div> </div> [/html] [html] <div class="box"> <div class="box_left"><img src="/shared/img/common/img_sample.png" width="250" alt="sample" /></div> <div class="box_color"> <p>aiueo ABCD</p> <p>テキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキスト</p> <ul class="list_check"> <li>テキスト</li> <li>テキスト</li> <li>テキスト</li> </ul> </div> </div> [/html]

グリッド

[html] <div class="row"> <div class="col3"><img src="/shared/img/common/img_sample.png" alt="sample" /></div> <div class="col3"><img src="/shared/img/common/img_sample.png" alt="sample" /></div> <div class="col3"><img src="/shared/img/common/img_sample.png" alt="sample" /></div> <div class="col3"><img src="/shared/img/common/img_sample.png" alt="sample" /></div> </div> <div class="row"> <div class="col4"><img src="/shared/img/common/img_sample.png" alt="sample" /></div> <div class="col4"><img src="/shared/img/common/img_sample.png" alt="sample" /></div> <div class="col4"><img src="/shared/img/common/img_sample.png" alt="sample" /></div> </div> <div class="row"> <div class="col6"><img src="/shared/img/common/img_sample.png" alt="sample" /></div> <div class="col6"><img src="/shared/img/common/img_sample.png" alt="sample" /></div> </div> <div class="row"> <div class="col6"> <p>テキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキスト</p> </div> <div class="col3"> <p>テキストテキストテキストテキストテキストテキストテキストテキストテキストテキスト</p> </div> <div class="col3"> <p>テキストテキストテキストテキストテキストテキストテキストテキストテキストテキスト</p> </div> </div> [/html]