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>

表示サンプル

枠線付きテーブル

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>

表示サンプル

その他の装飾

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

Bootstrapの装飾指定一覧

シンプルでカスタマイズしやすいWordPressテーマ

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

Lightningは twitter Bootstrap ベースのシンプルでカスタマイズしやすいWordPressテーマです。
プラグイン VK All in One Expansion Unit とセットで使う事でビジネスサイトにもブログにも活用できます。

詳しくはこちら