どうも！LSSです！！
先日の記事、
の続きです。
サンプル
うろこ、横に並んだ感じのほうがまだ使いがっていいかな？と。
コード
<div style="
width: 100%;
height: 150px;
border: 1px solid black;
padding: 0.5em;
font-size: 30px;
font-weight: bold;
text-shadow: 0px 0px 5px #ffffff;
background-color: #8888ff;
background-image:
radial-gradient(circle 20px at 0% 0%,#ddddff00 50%,#ddddff 99%,transparent 100%)
,radial-gradient(circle 20px at 0% 100%,#ddddff00 50%,#ddddff 99%,transparent 100%)
,radial-gradient(circle 20px at 0% 50%,#ddddff00 50%,#ddddff 99%,transparent 100%);
background-size: 40px 40px;
background-position: 0px 0px,0px 0px,20px 0px;
">
うろこ模様の背景
</div>
背景色で雰囲気が変わります！
今回はコード中に、
background-color: #8888ff;
と、背景色指定を入れてみました。
この #8888ff の部分が色を背景色を指定している部分ですが、ここを他の色に変更する事で、
pink
gold
black（これのみ、文字色も変えました）
white
って感じに、様々な雰囲気のうろこ模様になります^^
おまけ：もこもこ模様
作っている過程で、副産物的に出来た模様です。
コード
<div style="
width: 100%;
height: 150px;
border: 5px solid #ddddff;
border-radius: 15px;
padding: 0.5em;
font-size: 30px;
font-weight: bold;
text-shadow: 0px 0px 5px #ffffff;
background-color: white;
background-image:
radial-gradient(circle 40px at 0% 100%,#ddddff00 80%,#ddddff 90%,#ddddff00 100%);
background-size: 40px 40px;
background-position: 0px 0px;
">
もこもこ
</div>
あとがき
ネタ的には、５月５日向け？（季節感がががｗ）
季節、っていうと、クリスマスっぽいデザインを考えたほうがいいのかもですね。
あと、最後のおまけ「もこもこ」を、Amazonで検索してみると、
こっちのほうが余程、季節感がありそうなグッズが並んでいましたｗ
ってなとこで、今回はこのへんで！
次回もまた、よろしくお願いします^^
