ブロック要素の左上と右下に装飾文字を表示

ブロック要素（サンプルでは blockquote 要素）の左上と右下に任意の文字を装飾として表示します。

装飾文字を表示するブロック要素に "bracket" クラスを追加し、左上に表示する文字を "data-before" 属性 、右下に表示する文字を "data-after" 属性に指定します。

HTML

CSS

補足

• 装飾文字の大きさに合わせて、余白や表示位置の調整が必要です。

サンプル

「ブロック要素の左上と右下に装飾文字を表示」のサンプル