The #ChromeDevSummit site is live, happening Nov 12-13 in San Francisco, CA
Check it out for details and request an invite. We'll be diving deep into modern web tech & looking ahead to the platform's future.

网站不使用旧版 CSS Flexbox

为什么说此审查非常重要

2009 年的旧 Flexbox 规范已弃用,其速度比最新的规范慢 2.3 倍。 请参阅 Flexbox 布局并不慢了解更多信息。

如何通过此审查

URLs 下,Lighthouse 列出了它在页面样式表中找到的 display: box 的每个实例。 将每个实例替换为新语法,display: flex

如果样式表当前在使用 display: box,则它可能在使用其他已弃用的 Flexbox 属性。 简言之,以 box 开头的每个属性(如 box-flex)已弃用并且应予以替换。 请参阅 CSS Flexbox 2009/2011 规范语法属性对应关系以准确了解旧版属性与新版属性的对应关系。

如何实现此审查

本部分介绍如何实现此审查,以便您可以了解计算此审查得分的方式。

Lighthouse 收集页面上使用的所有样式表,并检查否有任何样式表使用 display: box。 Lighthouse 不会检查样式表是否使用任何其他已弃用的属性。