Compass 1.0 没有使用 Flexbox 的所有前缀

Posted 2023-02-22

【中文标题】Compass 1.0 没有使用 Flexbox 的所有前缀

【英文标题】：Compass 1.0 doesn't use all prefixes for Flexbox

【发布时间】：2014-07-02 11:52:13

【问题描述】：

我使用 Compass 1.0，当我使用 @include display-flex; 或任何其他与 flex 相关的属性时，我只得到

display: -webkit-flex;
display: flex;
-webkit-flex-flow: row wrap;
flex-flow: row wrap;

等等。没有 -moz 或 -o 前缀。知道为什么吗？

【参考方案1】：

Opera 从不为 Flexbox 使用 -o- 前缀。它是在没有前缀的 Presto 引擎下引入的。直到后来对 Flexbox 属性（以及其他一些属性）的支持才支持 -webkit- 前缀。

当前出现在 1.0 alpha 中的 Flexbox 模块仅发出当前 Flexbox 规范的属性。因此，您也不会看到 -moz- 前缀：Mozilla 引擎仅使用原始 Flexbox 规范的前缀（例如 display: -moz-box）。 Mozilla 从 22.0 开始支持不带前缀的当前规范（尽管直到 28.0 才支持 flex-wrap）。您也不会看到 -ms-prefix，因为使用前缀的 IE 版本支持较早的 2012 年 3 月草案（例如 display: -ms-flexbox）。

现在，如果您对一组与 Compass 兼容且涵盖您所有基础的 mixin 感兴趣，我已经写了一些：

Compatible with Compass 1.0 (slightly older version that shows usage) Compatible with Compass 0.12 (try it out on CodePen)

【讨论】：

非常有用的脚本。我只是把它放进去，重新编译，它就工作了。我现在可以在 5 分钟内让 flexbox 在 IE10 上运行。非常感谢@cimmonon。