当浏览器从服务器接收到一个HTML页面的请求时，到屏幕上渲染出来要经过很多个步骤。浏览器完成这一系列的运行，或者说渲染出来我们常常称之为“关键渲染路径”（Critical Rendering Path）。理解CRP（Critical Rendering Path）相关的知识可以更好的提高网站的性能。

我们是手机淘宝 虚拟互动实验团队，我们团队专门负责手机淘宝互动活动项目，致力于打造顶级互动氛围；我们面对的亿级用户群体，你的一个创意，一个效果直接向上亿级用户展示。我们是一个有实力的团队，是一个具有高颜值团队，我们更欢迎您的加入。如果您够自信，欢迎简历发至：weihua.lwh@alibaba-inc.com （坐标：杭州西厂）。

由于你可能没有那么多的时间，所以我将从结论开篇。你可以使用一个不常见，但是非常重要的CSS属性来使文字垂直显示。除了让文字垂直显示之外，你也可以让图标和入口按钮以这样的方式呈现。我写的CSS让浏览器重新布局文字的方向，使元素的布局在正常流的基础上旋转90度。

去年在CSS Conf科普了一下《CSS Grid Layout》相关的概念。会后PostCSS的作者@Andrey Sitnik给我力荐grid-kiss这个PostCSS插件。说这个插件可以让CSS Grid变得更为简单。一直都想尝试一下，就是没动手，今天体验了一下，还是很有意思的。今天花点时间整理一下，跟大家一起分享。

我们和全局作用域的CSS斗争了多年，现在终于是时候结束它了。不管你用的是什么语言还是框架，CSS命名冲突将不再是个问题。我将给你展示一下PostCSS和PostCSS-modules如何使用，并且可以在服务端使用它们。 CSS起初只是一个美化文档的工具，但是事情到1996年发生了变化。浏览器中不再单单只有文档了，即时通讯，各种软件，游戏，没什么是浏览器不能承载的。

Sass多年来一直是我的首选。最近我有一段时间，想尝试使用PostCSS的cssnext插件来处理CSS样式。我一直想使用工具尝试写一些CSS的新特性。同时自己的个人网站也是一个最佳测试这些新特性的实验地。

在前面的教程中，看到了怎么创建CSS Shapes,即在元素定认一个规则图形。里面都是些基础的知识，比如说创建一个圆，然后多行文本围绕这个圆。在这篇文章中，我们将探索一些更复杂的图形，让你的布局不在局限于四四方方的图形中。

在几个星期前,W3C在2016年11月发布了新的 HTML 5.1 recommendation,HTML规范得到了重大改进，在最近的博客中,W3C将新的主版本称为黄金标准，因为HTML 5.1为我们提供了新的方法，我们可以使用HTML来创建更灵活的网络体验。

去年@Erik Jung写了一篇文章来介绍CSS4 Color特性，那时并没有花时间去探讨其具体的使用方式，只是略知他能让你基于某个颜色，添加调节参数，得到新的颜色。由于其还是Color的新特性，所以目前如果不依赖于其他的手段，你在浏览器里是看不到效果的。当然也有非常出色的工程师，比如@Ahmad Shadeed写的一篇文章中，使用rgba()模拟出color-mod()函数的特性。

万维网联盟（W3C） 使用了一套特别的语法来定义 CSS 的属性值，能让所有的 CSS 属性都用。如果你曾看过 CSS 规范，你可能已经见过这套语法了。如果你不知道这些符号以及它们如何工作的话，这套语法可能非常难理解。然而，这值得花时间来学。如果你理解 W3C 是如何定义这些属性值的，你就可以理解 W3C CSS 规范 中任意一个了。