ブログの囲い枠の見出し用CSSサンプル-コピペで貼り付け

ブログの囲い枠の見出し用CSSサンプル-コピペで貼り付け

ブログ用の見出しCSSサンプル第二弾です。

今回は、CSSで囲い枠がある見出しサンプルをご紹介します。

WordPressのスタイルシートにもそのままコピペで使用できますのでご利用下さい。

 

囲い枠がある見出しサンプル

 

シンプルな囲い枠



文字色や枠線の色や大きさ、背景色などアレンジして好みのデザインにチャレンジして下さい。

 

囲いに丸みを付けた見出し



囲い枠にラインを入れた見出し


リボン系見出し



transparent transparent transparent #ffffff の色は背景色に合わせて下さい。

文字数が多く、改行してしまう場合には対応しておりません。

グラデーション系見出し



グラデーションも、なかなかいいですね~
 

 

まとめ

今回は、見出しに枠を付けたデザインを紹介しました。

今後もCSSで装飾する見出しを紹介していきます。

 

この記事が気に入ったら
いいね ! しよう

CSSカテゴリの最新記事