次来看一个带特殊圆角导航栏布局，如下谷歌浏览器的标签栏：

这样一个布局如何实现呢？

CSS 渐变几乎是无所不能的，什么的图形都能绘制，这里可以拆分一下，两个矩形，两个圆形，还有两个反向圆角，也就是 2 个 线性渐变，4 个径向渐变，示意如下：

最终实时效果如下（上面是原理图）

完整代码如下：

SS3丰富了色彩方面的内容，在纯色的基础上加入了渐变色的处理，线性渐变、径向渐变在web色彩上可以起到画龙点睛的效果。