夏休みですね。毎年この時期は夏休み子ども科学電話相談を聴きながら作業するんですが、先週からしばらく放送がお休みに入ってしまったのでちょっと寂しいです。
聴いてるうちに「夏休みだ!何かやらないと!作らないと!」という気分になってきたので、夏休みの宿題気分でCSSに挑んでみました。
CSSでお絵かきするという記事を複数見つけまして、
HTML/CSSで絵を描く猛者が作品を公開中 – Gigazine
CSSで「心がぴょんぴょんするイラスト」描いてみた。 – Qiita
夏休みの工作 兼 自由研究ということで、自分でも挑戦してみました。
大人だから夏休みじゃないけど!
久しぶりに子どもの頃の昆虫図鑑を出してきたりして頑張ってみました。こんな時に役に立つとは。捨てずに取っておいて良かった。
そういえば脚の位置はこうだったなあとか、脚のトゲトゲとか、よく見ながら絵にしていくことで理解も深まりました。
私はカナブンとかカマキリとかバッタとか緑色の虫が好きで、カブトやクワガタは採った事ないんですよ。これまでにカブトムシについてここまで凝視することはなかったです。
さて、出来上がりです。
transform: scale(-1, 1)
を指定して右半身を作成border
,border-radius
で作成border
で三角形を作りtransfom
で伸縮させて組み合わせbox-shadow
やグラデーションのdivで立体感を出すそんなこんなでできています。
昆虫の曲線の表現って難しいなあ……。