"吹き出し"を画像使わずにCSSで作る方法 | エンタープライズ | マイコミジャーナル

Filament Group ツールティップとしての吹き出しエフェクトはWebページでは広く使われるようになったUIのひとつだ。吹き出しの四隅は丸みを帯びて角の外側は透過表示になり、吹き出しを示すための小さい突起がついているところに特徴がある。多くの場合で背景画像がこれらUIを実現するために使われる。 Filament Groupにおいて、これに背景画像を使わずCSSと若干のHTML、それに多少のJavaScriptを使って実現する例がImage-free CSS Tooltip Pointers - A Use for Polygonal CSS?として紹介されている。Filament GroupではjQuery UIウィジェットの開発中にこの問題にあたり、CSSで多角形を描画するためのよく知られたトリックといくつかの工夫を凝らすことでこれを実現したと説明している。 背景画像を使わないで

[uk-ar]

Filament Groupにおいて、これに背景画像を使わずCSSと若干のHTML、それに多少のJavaScriptを使って実現する例がImage-free CSS Tooltip Pointers - A Use for Polygonal CSS?として紹介されている。Filament GroupではjQuery UIウィジェットの開発中にこ

[Nagise]

「CSS多角形トリックを使った三角形の描画」ってなんだろう？

[WebDesignScrach]

ツールチップ

[edo_m18]

divをひとつ（ないしふたつ）で実現する、簡単吹き出し。

[anhelo]

CSSと若干のHTML、それに多少のJavaScriptを使って実現する例