在上一节中，我们学习了如何使用 CSS 渐变创建各种类型的条纹。不过，条纹并不能代表所有的背景图案，最多只能算是背景中的几何图案。此外，我们还会常常用到许多类型的背景，比如网格、波尔卡圆点、棋盘格等等。值得庆幸的是，CSS 的渐变属性就可以帮我们创建这些背景图案。虽然几乎可以使用 CSS 的渐变创建各种类型的几何图案，但是这些背景图案的效果并不具有实用性。如果开发中稍不注意，那么代码就会迅速变得冗杂和繁琐。CSS 的背景图案也是非常适合使用 CSS 预处理器来处理的问题之一，比如可以使用 Sass 来减少重复背景图案中的重复工作。

和其他视觉设计相关的媒体一样，在 Web 上各类大小、颜色、角度不同的纹理也非常流行。不过，实现这些纹理的技术却并不理想。通常，我们需要创建独立的位图，如果有需求变更的话都需要重新更改文件。有些开发者使用 SVG 替代位图，但是 SVG 仍然是一种独立的文件，而且其语法也不够友好。那么是否有一种出色的方法让我们直接在 CSS 中创建纹理呢？你会惊喜的发现，我们将在文中逐步解决这一问题。

border-radius属性在CSS中已经不是什么新东东。大家都知道它可以帮助大家很容易完成圆角效果。有些时候，我们只希望容器的内部边框是圆角的，但是外部轮廓线要是矩形的，要完美的实现还是需要一定的技巧的。这篇文章告诉大家如何通过数学中的勾股定理来实现内凹圆角效果。

在 CSS 2.1 中，只能指定图片相对左上角的偏移量，或者使用关键字定位到其他的角落。如果需要让背景图距离元素四边距有一定的偏移量，相对而言是较为麻烦。在这篇文章中，作者通过background-position新特性、修改background-origin以及calc()函数等三种方法，实现了一种灵活型的背景图定位。希望这篇文章对大家有所帮助。

Backgrounds & Borders Level 3 还是一份草案的时候，CSS WG 就在是否支持多重边框的问题进行了大量的探讨，就像是讨论多重背景图片一样。不幸的是，当时认为多重边框的用处并不大，即使需要也可以使用border-image属性来模拟。不过，WG显然忘记了在 CSS 代码中灵活地调整边框，才是我们需要的，现在开发者只能使用一些Hack手段来模拟多重边框，比如使用多重元素的嵌套来模拟多重边框。现在，我将告诉你一些更优秀的方法，无需使用多余的标签即可实现多重边框。

虽然在border-color上能运用rgba()、hsla()设置边框为半透明或完全透明，如果元素设置了背景颜色或背景图片的时候，会直接影响边框的透明颜色效果。特别是，要看到边框底下的内容时。造成这个现象是由于背景图片会延伸到边框底部。要解决这一问题，可以通过CSS3的background-clip来修正。@Chris Coyier早在2010年的时候就在CSS-Tricks详细介绍过这方面的知识。

第一篇整理了有关于W3C标准规范的阐述，让大家对W3C组织有了更进一步的了解。今天整理了第二篇文章，这篇文章主要介绍了在编写CSS时有何技巧，在实际编码中如何注重这些细节。比如CSS属性的简写、响应式设计中的一些注意事项以及我们在实际开发中要不要使用CSS预处理器等。

《CSS Secrets》是@Lea Verou最新著作，这本书讲解了有关于CSS中一些小秘密。是CSSer值得一读的一本书，经过一段时间的阅读，我、@南北和@彦子一起将在W3cplus发布一系列相关的读后感，与大家一起分享。在这篇文章主要介绍了有关于Web标准(W3C)一些科普知识，让刚刚接触的同学对W3C有一个更完整的了解。

饼图，即使是最简单的只有两种颜色的形式，用Web技术创建也并不简单，尽管都是一些常见的信息内容，从简单的统计到进度条指标还有计时器。通常是使用外部图像编辑器来分别为多个值创建多个图像来实现，或是使用大型的JavaScript框架来设计更复杂的图表。尽管这个东西并不像它曾经看起来那么难以实现，但是也没有什么直接并且简单的方法。但是，现在已经有很多更好、更易于维护的方式来实现它。