デザイン枠ボックス

HTML

記事本文にアクセントを付けたい時に便利な枠付きボックスのCSSです。テーマCSSで指定済みのなのでhtmlタグにclassを付与してお使い下さい。
それぞれclassにtext-box2~4を適応し以下のようにdivでくくってお使い下さい。

<div class="text-box2">この中に記述</div>

記事中だけでなく、サイドバーのバナー、ボタンなどにも使えます。
また見出しのデザインにも応用できますね。

デザイン枠2 二重線ボーダー囲い

デザイン枠2 二重線ボーダー囲い

デザイン枠3 単線ボーダー囲い

デザイン枠3 単線ボーダー囲い

デザイン枠4 吹き出し

デザイン枠4 吹き出し

デザイン枠 タイトル付き囲み枠

おすすめ記事

記事下になどによく見るおすすめ記事囲み枠のように使えます。

HTMLコード

<div class="recommend-entry">
<div class="recommend_title">おすすめ記事</div>
この中に書く
</div>

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です