H2タイトルが入ります(Type:A)
ダミーテキストです。ダミーテキストです。ダミーテキストです。ダミーテキストです。ダミーテキストです。ダミーテキストです。ダミーテキストです。
▼ コードを見る
<h2>H2タイトルが入ります</h2>
H2タイトルが入ります(Type:B)
ダミーテキストです。ダミーテキストです。ダミーテキストです。ダミーテキストです。ダミーテキストです。ダミーテキストです。ダミーテキストです。
▼ コードを見る
<h2 class="type_b">H2タイトルが入ります</h2>
H3タイトルが入ります
ダミーテキストです。ダミーテキストです。ダミーテキストです。ダミーテキストです。ダミーテキストです。ダミーテキストです。ダミーテキストです。
▼ コードを見る
<h3>H3タイトルが入ります</h3>
H4タイトルが入ります
ダミーテキストです。ダミーテキストです。ダミーテキストです。ダミーテキストです。ダミーテキストです。ダミーテキストです。ダミーテキストです。
▼ コードを見る
<h4>H4タイトルが入ります</h4>
注意文
ダミーテキストです。ダミーテキストです。ダミーテキストです。ダミーテキストです。ダミーテキストです。ダミーテキストです。ダミーテキストです。
ダミーテキストです。ダミーテキストです。ダミーテキストです。ダミーテキストです。ダミーテキストです。ダミーテキストです。ダミーテキストです。
▼ コードを見る
<p class="notice_red">ダミーテキストです。<p>
リード文
ここにリード文が入ります。
▼ コードを見る
<p class="lead">ここにリード文が入ります。<p>
テキスト位置
左寄せ
中央寄せ
右寄せ
▼ コードを見る
<p class="t_left">左寄せ<p>
<p class="t_center">中央寄せ<p>
<p class="t_right">右寄せ<p>
リスト
番号リスト
- 番号リスト
- 番号リスト
- 番号リスト
- 番号リスト
- 番号リスト
- 番号リスト
▼ コードを見る
<ol>
<li>番号リスト
<ol>
<li>番号リスト</li>
<li>番号リスト</li>
<li>番号リスト</li>
</ol>
</li>
<li>番号リスト</li>
<li>番号リスト</li>
</ol>
リスト
- リスト
- リスト
- リスト
- リスト
- リスト
- リスト
▼ コードを見る
<ul class="list">
<li>リスト
<ul>
<li>リスト</li>
<li>リスト</li>
<li>リスト</li>
</ul>
</li>
<li>リスト</li>
<li>リスト</li>
</ul>
定義リスト
- 定義リスト
- ダミーテキストです。ダミーテキストです。ダミーテキストです。ダミーテキストです。ダミーテキストです。ダミーテキストです。ダミーテキストです。ダミーテキストです。
- 定義リスト
- ダミーテキストです。ダミーテキストです。ダミーテキストです。ダミーテキストです。ダミーテキストです。ダミーテキストです。ダミーテキストです。ダミーテキストです。
▼ コードを見る
<dl>
<dt>定義リスト</dt>
<dd>ダミーテキストです。ダミーテキストです。ダミーテキストです。ダミーテキストです。ダミーテキストです。ダミーテキストです。ダミーテキストです。ダミーテキストです。</dd>
<dt>定義リスト</dt>
<dd>ダミーテキストです。ダミーテキストです。ダミーテキストです。ダミーテキストです。ダミーテキストです。ダミーテキストです。ダミーテキストです。ダミーテキストです。</dd>
</dl>
リンク
▼ コードを見る
<p><a href="URL" class="link-out" target="_blank">外部リンク</a></p>
▼ コードを見る
<p><a href="xxx.pdf" class="pdf" target="_blank">PDFリンク</a></p>
テーブル
Workshop
第1回 | xx月xx日(曜日) 18:30~21:00 |
ダミーテキストです。ダミーテキストです。ダミーテキストです。ダミーテキストです。 |
第2回 | xx月xx日(曜日) 18:30~21:00 |
ダミーテキストです。ダミーテキストです。ダミーテキストです。ダミーテキストです。 |
第3回 | xx月xx日(曜日) 18:30~21:00 |
ダミーテキストです。ダミーテキストです。ダミーテキストです。ダミーテキストです。 |
体験会(複数日)
4月21日(木) | 15:00~16:30(受付14:30~) | 熱田文化小劇場 |
xx月xx日(曜日) | 18:30~21:00 | ここに会場名がはいります。 |
xx月xx日(曜日) | 18:30~21:00 | ここに会場名がはいります。 |
▼ コードを見る
<table class="table_normal">
<tr>
<td>第1回</td>
<td>xx月xx日(曜日)<br>18:30~21:00</td>
<td>ダミーテキストです。ダミーテキストです。ダミーテキストです。ダミーテキストです。</td>
</tr>
<tr>
<td>第2回</td>
<td>xx月xx日(曜日)<br>18:30~21:00</td>
<td>ダミーテキストです。ダミーテキストです。ダミーテキストです。ダミーテキストです。</td>
</tr>
<tr>
<td>第3回</td>
<td>xx月xx日(曜日)<br>18:30~21:00</td>
<td>ダミーテキストです。ダミーテキストです。ダミーテキストです。ダミーテキストです。</td>
</tr>
</table>>
スマホではテーブルが解除されブロック要素として表示されます。
体験会(1日のみ)
日時 | 4月21日(木) 15:00~16:30(受付14:30~) |
---|---|
場所 | 熱田文化小劇場 |
レイアウトパターン
1カラム
▼ コードを見る
<div class="pattern1">
<figure><a href="リンク先のURL" target="_blank"><img src="画像のURL" alt="" /></a><figcaption>(クリックするとPDFが開きます)</figcaption></figure></div>
▼ コードを見る
<div class="pattern1">
<figure><a href="リンク先のURL" target="_blank"><img src="画像のURL" alt="" /><img src="画像のURL" alt="" /></a><figcaption>(クリックするとPDFが開きます)</figcaption></figure></div>
2カラム
▼ コードを見る
<div class="pattern1_1">
<div class="col_l">
<figure><a href="リンク先のURL" target="_blank"><img src="画像のURL" alt="" /></a><figcaption>(クリックするとPDFが開きます)</figcaption></figure></div>
<div class="col_r">
<figure><a href="リンク先のURL" target="_blank"><img src="画像のURL" alt="" /></a><figcaption>(クリックするとPDFが開きます)</figcaption></figure></div>
</div>
申込フォームボタン
▼ コードを見る
<div id="btn_entry">
<p><a href="申込フォームのページURL"><span class="icon-new-tab"></span>申込フォームはこちら</a></p>
</div>
お問い合わせフォームのリンク
▼ コードを見る
<p id="btn_contact"><span class="icon-arrow-right2"></span><a href="/contact/">お問い合わせフォームはこちら</a></p>