【コピペでOK】グラデーションフレーム
今回はCSSでグラデーションの枠を作ってみました。もしよかったら参考にしてみて下さいね🎵完成見本1️⃣ボーダーに見えますが、実はグラデーションの四角の上に、ひとまわり小さい白い四角が置いてあります。html1️⃣ <div class="colorful-border"> <p>セール開催中!!</p> </div>CSS1️⃣ <style> .colorful-border { display: flex; justify-content: center; align-items: center; text-align: center; background: linear-gradient(30deg, #7bffff, #ff7); padding: 0.5rem; } .colorful-border p { font-size: 2rem; letter-spacing: 0.5rem; color: tomato; font-weight: bold; background: #fff; width: 100%; height: 100%; margin: 0; padding: 2rem; } </style>完成見本2️⃣グラデーションの大きさをアニメーションを使って変えることで、ゆらりと色が変化して見えるボーダーとなっています。↓html2️⃣<div class=
0