说明：
一般情况下，在布局页面的时候一下这种效果图都会使用一个小的背景图平铺实现。但是如果使用标准浏览器和CSS3，那么可以很容易的使用linear-gradient这个属性模拟出以下效果图
下面看效果:
请使用Firefox或chorme查看