はてなアイデア
で見かけた
コメント欄の表示方法が面白かったので真似っこしてみました。
マンガのように個々にフキダシを使って表示するという方法です。
ソース
仕組みはいたって簡単で、フキダシ部分の画像を用意し、
これをhead部分の背景画像に指定します。
この時，フキダシ画像文のpaddingを指定するのを忘れずに。
そしてbody部分では、borderプロパティで左右と下側に枠線を設定します。
上側の枠線はheadの背景画像に指定したフキダシが担ってくれるので指定しません。
フキダシ画像や背景色を変更すれば、違った感じのフキダシを簡単に作ることができます。
IEはPNG画像の透過属性に対応していません。GIF画像なら大丈夫です。
この記事を読んだ人はこんな記事も読んでいます
CSS, XSS, DSS, FSS, VSS, CAS, CWS, CES, CDS, CXS, CZS, CSA, CSW, CSE, CSD, CSX, CSZ
Tips, Rips, 5ips, 6ips, Yips, Gips, Fips, TUps, T8ps, T9ps, TOps, TKps, TJps, TiOs, Ti0s, Ti-s, TiLs, TipA, TipW, TipE, TipD, TipX, TipZ
デザイン
English
寄せられたコメント (全 1 件中、最新 5 件まで表示しています)
こんな感じです。コメント欄で使うと効果的かも。