今回は、付箋風の見出しをCSSで作る方法を紹介したいと思います! 最初に、ベースとなるCSSコードを紹介した後、簡単なカスタムパターンをいくつか紹介していきます。 目次 ブログで使用する場合は はてなブログの場合 ベースコード 使い方 カスタムパターン 付箋風見出しの色を変えてみる! 背景色も調整してみる! 角丸表示にしてみる! 右側だけ(もしくは左側だけ)を角丸にしてみる! 影の度合いを調整してみる! まとめ ブログで使用する場合は ご利用のブログがHTML記述に対応している場合は、紹介するCSSを<style>と</style>で囲んで記述してください。 ※ CSS用の入力欄がある場合は<style>と</style>の囲みなしで記述してください。 HTMLコードについては、そのまま入力でOKです。 はてなブログの場合 はてなブログでのCSSの使用については、以下の記事でまとめています
![【CSS】付箋風の見出しをCSSで作ってみる! - mlog](https://cdn-ak-scissors.b.st-hatena.com/image/square/d4eb452113529d1e2055584ed2e5989a1b2ea987/height=288;version=1;width=512/https%3A%2F%2Fi.gyazo.com%2Fc5f730a423badaa7e04b824b230a8a69.png)