如何在 chrome 中关闭 css 的功能以进行测试，例如 css grid

Question

I'm trying to see how my app will look when css grid isn't available. Is it possible to turn off properties like css grid inside of the chrome or canary?

Answer 1

在https://caniuse.com/#search=shape-outside上检查后，下载不支持此功能的旧版 Chrome。

Answer 2

The CSS Feature Toggles plugin for Chrome can do this. It adds a tab in the developer toolbox with checkboxes for various CSS features that are popular for browsers to not implement, like Grid:

Checking the relevant box will disable the respective feature.

Answer 3

Just comment out CSS Grid.

/* .container { display: grid; } */

Or uncheck the rule in dev tools.

Chrome will then ignore all grid properties, just like a browser would that lacks support for the feature.