快晴!この空の色は何色?

20131203_photo

今朝は、とてもきれいな青空だったので、都庁と青空を撮りました。
そこで思ったことですが、これをWebで再現しようとしたらどうなるのだろう・・・ということで、ちょいと作ってみました。
 
 
 
 

上の方の色(#82b4f1) グラデーションで再現? 下の方の色(#b2e1ff)

もう少し大きくしてみました。

今日の快晴を再現?

う~ん、ちょっとはそれっぽいかな。でも、さすがに自然の色を出すのは難しいですね。

ちなみに、今回のソースコード(上側)は以下になります。

<table border="1" height="100">
	<tr>
		<td align="center" style="background:#82b4f1;">上の方の色(#82b4f1)</td>
		<td align="center" style="background:-moz-linear-gradient(top, #82b4f1, #b2e1ff); background:-webkit-gradient(linear, left top, left bottom, from(#82b4f1), to(#b2e1ff));">グラデーションで再現?</td>
		<td align="center" style="background:#b2e1ff;">下の方の色(#b2e1ff)</td>
	</tr>
</table>

グラデーションって、こうやって作るのですね。
初めて知りました。

◆参考にしたURL
http://www.css-lecture.com/log/css3/css3-gradient.html

Pocket
LINEで送る

  1. コメントはまだありません。

  1. トラックバックはまだありません。

CAPTCHA