ExUnit 役立つ便利なCSS設定

ExUnit固有の設定

ExUnitで規定値として使えるCSSです。コンテンツによっては便利で使えそうです。

FAQ


<dl class="veu_qaItem">

<dt>質問1</dt>

<dd>回答回答回答回答回答回答</dd>

</dl>

<dl class="veu_qaItem">

<dt>質問2</dt>

<dd>回答回答回答回答回答回答</dd>

</dl>

表示サンプル

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

BootstrapのCSS設定

Gridレイアウト


<div class="row">

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

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

</div>

<hr>

<div class="row">

<div class="col-sm-4">テキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキスト</div>

<div class="col-sm-8">テキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキスト</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>

表示サンプル

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

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

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

テーブル


<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 テーブル内容テーブル内容テーブル内容。テーブル内容テーブル内容テーブル内容テーブル内容
参照サイト
ExUnit
最近のウェブサイトに求められる様々な機能を実装した多機能統合型プラグインです。