gradient

边角阴影渐变

最近看一些网站的时候经常看到边角阴影,所以单独拿出来说说。 比如 Nettuts+ 的设计,主内容区的右上角有非常浅的渐变,并有1px的白色勾线。这些细节设计虽然非常淡,甚至很多人根本不会去注意到这些,但它们累加起来的效果非常出色——不论我们有否发觉,重要的是我们确实受到了这些细节的视觉上的影响。 虽然 Nettuts+ 用了一张png的边角渐变的图片,但显然代码也能实现。线性渐变作为CSS3的标配,虽然使用上需要加上麻烦的前缀,但放眼望去用上代码渐变的页面也已经相当普遍。使用上需要注意的是 Chrome 9- 以及 Safari 4- 使用的都是非标的 webkit-gradient 语法: corner-gradient:before{…