IE 11 中 flex unset 和 flex none 之间的区别

Posted 2023-03-05

【中文标题】IE 11 中 flex unset 和 flex none 之间的区别

【英文标题】：Difference between flex unset and flex none with IE 11

【发布时间】：2019-08-23 22:56:44

【问题描述】：

flex: unset 和 flex: none 有什么区别？我找不到任何具体的文档来说明flex: unset 的实际作用。此外，flex: unset 似乎在 IE 11 中不起作用。

对于某些内容，我们最近在 IE 11 上遇到了一个问题，其中我们有一些具有 flex: 1 0 auto 的类 .cta-button，当我们添加类 .flex-unset 时，它会设置 flex: unset 并覆盖 flex: 1 0 auto。这适用于 Chrome、Firefox 和 Edge，但不适用于 IE 11。对于 IE 11，我们必须设置 flex: none 而不是 flex: unset。

【问题讨论】：

简而言之：IE 无论如何都不支持 unset。见caniuse.com/#search=unset

developer.mozilla.org/en-US/docs/Web/CSS/unset unset IE 不支持，使用 none

太棒了，谢谢！我不敢相信我没有检查caniuse。我刚刚离开谷歌和developer.mozilla.org/en-US/docs/Web/CSS/flex，但从未进入特定的未设置页面。

如果浏览器同时支持两者，unset 会重置为继承的值，或者如果没有继承默认值 (0 1 auto)，则 none 会将值设置为 none 值 (0 0 auto)

【参考方案1】：

理解差异的关键在于了解 unset 通常的实际作用。

unset 只是使用继承和初始的混合体。

https://developer.mozilla.org/en-US/docs/Web/CSS/unset

如果您在该页面上向下滚动可以看到，IE 不支持取消设置。如果你知道你的类没有继承 flex 属性，你可以将 flex 设置为 initial。