ExUnit固有の設定

リードテキスト

HTML

<p class="veu_leadTxt">リードテキスト</p>

表示サンプル

リードテキスト

FAQ

HTML

<dl class="veu_qaItem">
<dt>質問1</dt>
<dd>回答回答回答回答回答回答</dd>
</dl>
<dl class="veu_qaItem">
<dt>質問2</dt>
<dd>回答回答回答回答回答回答</dd>
</dl>

表示サンプル

質問1
回答回答回答回答回答回答
質問2
回答回答回答回答回答回答

業務の流れなど

HTML

<div>
<div class="veu_flowBox">
<dl>
<dt>お問い合わせ</dt>
<dd>まずはお気軽のお問い合わせください。</dd>
</dl>
</div>
<div class="veu_flowBox">
<dl>
<dt>納品・ご入金</dt>
<dd>納品いたしましたらご入金よろしくお願いいたします。</dd>
</dl>
</div>
</div>

表示サンプル

お問い合わせ
まずはお気軽のお問い合わせください。
納品・ご入金
納品いたしましたらご入金よろしくお願いいたします。

BootstrapのCSS設定

ボタン

HTML

<a href="#" class="btn btn-primary btn-lg">Large button</a> <a href="#" class="btn btn-default btn-lg">Large button</a>
<a href="#" class="btn btn-primary">Default button</a> <a href="#" class="btn btn-default">Default button</a>
<a href="#" class="btn btn-primary btn-sm">Small button</a> <a href="#" class="btn btn-default btn-sm">Small button</a>
<a href="#" class="btn btn-primary btn-xs">Extra small button</a> <a href="#" class="btn btn-default btn-xs">Extra small button</a>
<a href="#" class="btn btn-primary btn-lg btn-block">Large button</a> <a href="#" class="btn btn-default btn-lg btn-block">Large button</a>

表示サンプル

Large button Large button

Default button Default button

Small button Small button

Extra small button Extra small button

Large button Large button

Gridレイアウト

HTML

<div class="row">
<div class="col-sm-6">テキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキスト</div>
<div class="col-sm-6">テキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキスト</div>
</div>
<hr />
<div class="row">
<div class="col-sm-3">テキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキスト</div>
<div class="col-sm-3">テキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキスト</div>
<div class="col-sm-3">テキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキスト</div>
<div class="col-sm-3">テキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキスト</div>
</div>

表示サンプル

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

テーブル

HTML

<table class="table table-responsive table-striped">
<thead>
<tr>
<th>thead th</th>
<th>thead th</th>
</tr>
</thead>
<tbody>
<tr>
<th>th テーブル項目</th>
<td>td テーブル内容テーブル内容テーブル内容テーブル内容。テーブル内容テーブル内容テーブル内容</td>
</tr>
<tr>
<th>th テーブル項目</th>
<td>td テーブル内容テーブル内容テーブル内容。テーブル内容テーブル内容テーブル内容テーブル内容</td>
</tr>
</tbody>
</table>

表示サンプル

thead th thead th
th テーブル項目 td テーブル内容テーブル内容テーブル内容テーブル内容。テーブル内容テーブル内容テーブル内容
th テーブル項目 td テーブル内容テーブル内容テーブル内容。テーブル内容テーブル内容テーブル内容テーブル内容

枠線付きテーブル

HTML

<table class="table table-responsive table-striped table-bordered">
<thead>
<tr>
<th>thead th</th>
<th>thead th</th>
</tr>
</thead>
<tbody>
<tr>
<th>th テーブル項目</th>
<td>td テーブル内容テーブル内容テーブル内容テーブル内容。テーブル内容テーブル内容テーブル内容</td>
</tr>
<tr>
<th>th テーブル項目</th>
<td>td テーブル内容テーブル内容テーブル内容。テーブル内容テーブル内容テーブル内容テーブル内容</td>
</tr>
</tbody>
</table>

表示サンプル

thead th thead th
th テーブル項目 td テーブル内容テーブル内容テーブル内容テーブル内容。テーブル内容テーブル内容テーブル内容
th テーブル項目 td テーブル内容テーブル内容テーブル内容。テーブル内容テーブル内容テーブル内容テーブル内容

その他の装飾

Bootstrapでは様々な装飾が予め用意されています。

Bootstrapの装飾指定一覧

ビジネスサイトもブログも最短で作れる WordPress テーマ

※このエリアは多機能プラグイン「VK All in One Expansion Unit」で一括挿入しています。投稿タイプ毎または記事毎に表示内容を変更する事も可能です。

Lightning は「いかに最短でサイト制作ができるか」を追求し、短期間で高品質なWebサイトを構築できるよう設計された WordPress テーマです。
プラグイン VK All in One Expansion Unit とセットで使う事でビジネスサイトにもブログにも活用できます。
詳しくはこちら