サンプルページ

sample

見出し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]

レイアウト

sample

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

[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]
sample

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

[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]
sample

aiueo ABCD

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

  • テキスト
  • テキスト
  • テキスト
[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]

グリッド

sample
sample
sample
sample
sample
sample
sample
sample
sample

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

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

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

[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]