纯css画星空

今天闲逛codePen，看到有人用css画星星，于是心血来潮，自己也画了一幅心目中的夜空。因为没有使用js，每颗星星都必须单独定位和写样式。我已经尽量用最简洁的方式来实现了。

演示地址：http://denghao.me/demo/2015/nightSky.html (还在用ie8以下的人出门左拐)。

实现过程：

1. 月亮：使用了弧度属性border-radius和阴影属性box-shadow；

2. 背景：使用了渐变属性linear-gradient；

3. 星星：使用了弧度属性border-radius和基础的animation动画；

4. 房子：使用了三条边框border的配合画出三角形，::after和::before的配合画出窗户十字架，当然也可以多使用两个div来实现。

总结：总的来说用css画图，不需要什么深奥的技术，要的是耐心。我的初衷是想对比一下css和canvas在绘画上的差异，感觉和canvas相比，css在绘画上施展的空间不大，而且实现起来也比较繁琐，可能是自己功力不够吧，改天把canvas的补上。