うまくコピペできない場合は、記事からもコピペできるよう準備しております。
Code Stock
【html&css】コピペで作る！おしゃれなボックスデザイン50選
【HTML/CSS】コピペで即実装！おしゃれなボックスデザイン（囲み枠）50選。シンプル・付箋風・タイトル付き・引用風など、ブログやWeb制作に役立つ多彩なCSSコードをプレビ…
Simple quote
シンプルな引用ボックス
左に線を付けたシンプルな引用ボックスです。
出典：ここに引用元を入れる
ここに引用するコンテンツを入れます。ここに引用するコンテンツを入れます。
×
デザイン調整
HTMLコピペ
CSSコピペ
完了
HTMLをコピペしてください
HTML
CSSをコピペしてください
CSS
お疲れ様でした！
デザインの作成が完了しました。
Icon quote
アイコン付きの引用ボックス
かぎ括弧で囲ったアイコン付きの引用ボックスです。
出典：ここに引用元を入れる
ここに引用するコンテンツを入れます。ここに引用するコンテンツを入れます。
背景とアイコンを付けた、シンプルかつ分かりやすい引用ボックスです。
出典：ここに引用元を入れる
ここに引用するコンテンツを入れます。ここに引用するコンテンツを入れます。
左枠線を太くし、アイコンをより際立たせた引用ボックスです。
出典：ここに引用元を入れる
ここに引用するコンテンツを入れます。ここに引用するコンテンツを入れます。
×
デザイン調整
HTMLコピペ
CSSコピペ
完了
HTMLをコピペしてください
HTML
CSSをコピペしてください
CSS
お疲れ様でした！
デザインの作成が完了しました。