どうも!LSSです!!
5月5日「こどもの日」でしたね!
もう、その日も終わろうという頃になって、何かそれっぽい事をこなしたくなりましたw
気の抜けた「こいのぼり」
コード
<style>
.koinobori{
width:300px;
height:450px;
background:
radial-gradient(15px 40px at 40px 50px,#ffffff 90%,#000000 99%,#00000000 100%)
,conic-gradient(from 200deg at 250px 420px,#ff0000 70deg,#ff000000 71deg) 40px -408px
,conic-gradient(from 200deg at 250px 420px,#ffff00 70deg,#ffff0000 71deg) 40px -380px
,conic-gradient(from 200deg at 250px 430px,#0000ff 70deg,#0000ff00 71deg) 40px -360px
,radial-gradient(20px 20px at 90px 140px,#000000 30%,#ffffff 31% 95%,#000000 96% 99%,#00000000 100%)
,radial-gradient(15px 40px at 40px 150px,#ffffff 90%,#000000 99%,#00000000 100%)
,conic-gradient(at 100px 80px,#000000 90deg,#00000000 91deg) -60px 110px
,radial-gradient(15px 40px at 240px 150px,#000000 99%,#00000000 100%)
,radial-gradient(20px 20px at 90px 240px,#000000 30%,#ffffff 31% 95%,#000000 96% 99%,#00000000 100%)
,radial-gradient(15px 40px at 40px 250px,#ffffff 90%,#000000 99%,#00000000 100%)
,conic-gradient(at 100px 80px,#ff0000 90deg,#ff000000 91deg) -60px 210px
,radial-gradient(15px 40px at 240px 250px,#ff0000 99%,#ff000000 100%)
,radial-gradient(20px 20px at 90px 340px,#000000 30%,#ffffff 31% 95%,#000000 96% 99%,#00000000 100%)
,radial-gradient(15px 40px at 40px 350px,#ffffff 90%,#000000 99%,#00000000 100%)
,conic-gradient(at 130px 80px,#0000ff 90deg,#0000ff00 91deg) -90px 310px
,radial-gradient(15px 40px at 210px 350px,#0000ff 99%,#0000ff00 100%)
,linear-gradient(#8888ff,#ffffff);
}
</style>
<div class="koinobori"> </div>
あとがき
はい、「radial-gradient」と「conic-gradient」をたくさん重ね合わせただけの「こいのぼり」でした。
一尾あたり4つ、上から「目」「口」「胴」「尾」に該当します。
…絵としてはあまりにも…単純に記号化された感じですねw
ってなとこで、今回はこのへんで!
次回もまた、よろしくお願いします^^