0

CSSで吹き出しを表現する

CSSで吹き出しを表現する

チャットやサイトのコメント欄で、閲覧者からのコメントを吹き出し状にしたい時など、今まではわざわざ背景画像などを用意して配置していたりしましたが、CSSだけで表現することが出来るようになりました。その方法を簡単にご紹介します。

 

デモサンプル

1.HTMLを記述

2.CSSを記述する

下付き吹き出しの場合、左右のborderを非表示にして、border-topのみ表示し、絶対配置で下に10pxずらして配置しています。

解説

以上になります。

 




コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください

mororeco > CSS > CSSで吹き出しを表現する