アウトラインのあるフシダシ(balloon)を作る方法はいくつかあります。ここでは疑似要素を使って作ってみます。 ここではさらに条件として、背景色が既知ではないことを前提としています。これは以下の画像での赤い部分が transparent として指定されている、あるいはそもそも存在していないかのどちらかであることを意味します。 実際に作った実際の結果とそのリポジトリは以下の URL になります。 https://css-balloon-tails.pages.dev/ https://github.com/hbsnow-sandbox/css-balloon-tails 基本となる TSX は以下になります。Tailwind CSS を使っています。 <div className={` ${classnames( "relative", "w-min", "bg-blue-200", "b
![CSS でアウトラインのあるフキダシのしっぽを疑似要素で手軽に作る方法 | DevelopersIO](https://cdn-ak-scissors.b.st-hatena.com/image/square/7e12c940e61196e18b3bde02ef025216a29b7089/height=288;version=1;width=512/https%3A%2F%2Fdevio2023-media.developers.io%2Fwp-content%2Fuploads%2F2021%2F08%2Fa11b4bb3ba448d1fa402ac3dc62cc91f-3.jpg)