htmlとcssで吹き出し 応用編

hiromitsu-daisuke.hatenablog.com

だいぶ間が空いてしまいましたが、吹き出しの応用編です。

罫線つきの吹き出し

See the Pen balloon border by HIROMITSU Daisuke (@daisuke718) on CodePen.

擬似要素のbeforeとafterを使って2つの三角形を追加して、一方をずらして罫線のように見せています。

心の中の吹き出し（？）

See the Pen balloon think by HIROMITSU Daisuke (@daisuke718) on CodePen.

こっちはbeforeとafter分かってたら簡単ですね。