面临 CSS 跨浏览器冲突 [Mozilla Firefox 上的问题]

Question

我有一个 class .a 具有以下 CSS 属性：

.a {
   display: flex;
   background: linear-gradient(red, green);
}

这里我有一个为 flex 定义的属性 属性

这在 Google Chrome 中运行良好，但在 Firefox 中查看站点时，会导致一些问题。有什么可以帮助您的，或者有什么工具可以将 CSS 规则转换为适用于所有浏览器？

Answer 1

尝试：

.a {
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   background: -webkit-linear-gradient(red, green);
   background: linear-gradient(red, green);
}

你可以使用的是Autoprefixer

Answer 2

试试这个：

.a {
 display: -webkit-box;
 display: -webkit-flex;
 display: -ms-flexbox;
 display: flex;
 background: -webkit-linear-gradient(red, green);
 background: linear-gradient(red, green);
}