如何制作背景，让HTML5网站模板更吸引人？

先聊聊背景到底能干啥

说实话，背景是网页的第一张脸。

你打开一个站点，第一眼看到的往往就是那块颜色或者图案，太扎心了。。

何不... 如果这块儿不够亮眼，用户可能就直接划走了。

哈哈，这可不是危言耸听，咱们自己做的demo也能感受到。

所以给HTML5模板挑个好背景，真的能让人眼前一亮。

纯色背景：最平安的起步

最懒的办法，就是直接用background-color。

盘它。 比如#f5f5f5 #fff之类的浅色系，配合深色文字，看起来舒服。

别忘了加上transition 让颜色切换时有点小动画，提升细节感，不堪入目。。

这个方法兼容性杠杠的，老IE也能跑。

渐变背景：玩点花里胡哨

CSS3已经支持线性和径向渐变啦。

归根结底。 background: linear-gradient;

一句话搞定从左到右的渐变。

如果想要更炫酷，可以配合@keyframes做动态渐变，太顶了。。

比如每隔几秒把角度调一下让颜色像波浪一样滚动。

图片背景：经典但要会选图

图片是最直观的视觉冲击，但选图一定要慎重，哭笑不得。。

先说说分辨率要够高，不然在大屏幕上会模糊。

接下来不要太抢眼，最好做个淡化或加点透明度，让内容仍然是主角，内卷...。

.bg { background:url no-repeat 切中要害。