{"provider_url":"https://hatena.blog","author_name":"kimizuka","height":"190","author_url":"https://blog.hatena.ne.jp/kimizuka/","html":"<iframe src=\"https://hatenablog-parts.com/embed?url=https%3A%2F%2Fblog.kimizuka.org%2Fentry%2F2024%2F04%2F19%2F203424\" title=\"details\u8981\u7d20\u306eopen\u5c5e\u6027\u306e\u6709\u7121\u3067\u30d7\u30ed\u30d1\u30c6\u30a3\u3092\u5909\u5316\u3055\u305b\u308b\u969b\u3001transition\u3092\u8a2d\u5b9a\u3057\u3066\u3082\u30a2\u30cb\u30e1\u30fc\u30b7\u30e7\u30f3\u3057\u306a\u3044 \ud83d\ude31 - \u307f\u304b\u3065\u304d\u30d6\u30ed\u30b0\u30fb\u30ab\u30b9\u30bf\u30e0\" class=\"embed-card embed-blogcard\" scrolling=\"no\" frameborder=\"0\" style=\"display: block; width: 100%; height: 190px; max-width: 500px; margin: 10px 0px;\"></iframe>","blog_title":"\u307f\u304b\u3065\u304d\u30d6\u30ed\u30b0\u30fb\u30ab\u30b9\u30bf\u30e0","provider_name":"Hatena Blog","image_url":"https://cdn-ak.f.st-hatena.com/images/fotolife/k/kimizuka/20240419/20240419203414.png","url":"https://blog.kimizuka.org/entry/2024/04/19/203424","title":"details\u8981\u7d20\u306eopen\u5c5e\u6027\u306e\u6709\u7121\u3067\u30d7\u30ed\u30d1\u30c6\u30a3\u3092\u5909\u5316\u3055\u305b\u308b\u969b\u3001transition\u3092\u8a2d\u5b9a\u3057\u3066\u3082\u30a2\u30cb\u30e1\u30fc\u30b7\u30e7\u30f3\u3057\u306a\u3044 \ud83d\ude31","type":"rich","version":"1.0","description":"details\u8981\u7d20\u81ea\u4f53\u3092\u30a2\u30cb\u30e1\u30fc\u30b7\u30e7\u30f3\u3055\u305b\u308b\u5834\u5408 details\u8981\u7d20\u81ea\u4f53\u306btransition\u3092\u8a2d\u5b9a\u3057\u3001open\u5c5e\u6027\u306e\u6709\u7121\u3067\u30d7\u30ed\u30d1\u30c6\u30a3\u3092\u5909\u5316\u3055\u305b\u305f\u3068\u304d\u306f\u30a2\u30cb\u30e1\u30fc\u30b7\u30e7\u30f3\u3057\u307e\u3059\u3002 \u203b Google Chrome\uff08123.0.6312.124\uff09\u3067\u3057\u304b\u78ba\u8a8d\u3057\u3066\u3044\u307e\u305b\u3093\u3002 DEMO SCSS details { background: rgba(255, 0, 0, .2); transition: background .2s ease-in-out; // \u52b9\u679c\u3042\u308a &[open] { background: rgba(0, 255, 0, .2); } } details\u8981\u7d20\u306e\u5b50\u8981\u7d20\u3092\u30a2\u30cb\u30e1\u30fc\u30b7\u30e7\u2026","published":"2024-04-19 20:34:24","blog_url":"https://blog.kimizuka.org/","categories":["CSS"],"width":"100%"}