Chrome 69 对我们 CSS 开发人员来说意义重大
- 圆锥渐变(即
background: conic-gradient(red, green, blue);
):我们这里有很多关于圆锥渐变的有趣文章,这里还有 Lea Verou 提供的一些用例和 polyfill。 - 逻辑盒模型属性:
margin
、padding
和border
都进行了升级,以满足更多用例。想想我们现在是如何使用margin-left
的——当我们改变方向时,“left” 部分就没有多大意义了。现在,我们将使用margin-inline-start
来代替。完整的列表是 margin-{block,inline}-{start,end}、padding-{block,inline}-{start,end} 和 border-{block,inline}-{start,end}-{width,style,color}。Rachel Andrew 撰写了理解逻辑属性和值。 - 滚动捕捉点(即
scroll-snap-type: x mandatory;
):曾经需要 JavaScript 干预的功能现在愉快地集成到了 CSS 中。我们已经介绍过多年了。这在使轮播变得不那么复杂方面发挥了很大的作用。 - 环境变量(即
env(safe-area-inset-top);
):苹果在 iPhone X 中引入了“刘海”,并发布了一些专有的 CSS 来处理它。社区迅速做出回应,现在我们有了env()
,以便浏览器可以交付此类内容。
我想我们可以给这个版本号一个当之无愧的“赞”。