el plano には「装飾用スタイルシート定義」が実装されており、これらを活用することによりコンテンツを装飾したり、レイアウトを施したりすることができます。
この記事では、ラベル表示についての方法を記載しています。
ラベル表示のみ
<span class="label label-primary">ラベル</span>
ラベル
<span class="label label-orange">ラベル(オレンジ)</span>
ラベル(オレンジ)
<span class="label label-pink">ラベル(ピンク)</span>
ラベル(ピンク)
<span class="label label-green">ラベル(緑)</span>
ラベル(緑)
<span class="label label-red">ラベル(赤)</span>
ラベル(赤)
<span class="label label-blue">ラベル(青)</span>
ラベル(青)
ラベル表示 + 右側のテキスト表示
<span class="label label-primary">ラベル</span><span>ラベル右のテキスト</span>
ラベルラベル右のテキスト
ラベル表示 + 直下のテキスト表示
<p class="label label-primary">ラベル</p>
ラベルをPタグで括って改行した位置に挿入したテキスト。
ラベル
ラベルをPタグで括って改行した位置に挿入したテキスト。
あとがき
このブログは、当初無料ブログサービスのSeesaaブログを利用して始めました。その中で、ラベル表示をCSSを駆使して表示してみました。
el plano では、実装されているスタイルシート定義で簡単に表示させることができます。
無料ブログにはない「多機能さ」に付加価値を感じられます。
見栄えもしますので、有効活用していきたいと思います。
スマートフォン対応カスタマイズ型WordPressテーマ
「el plano」を導入検討する
LEAVE A REPLY