CSS什么是-moz-和-webkit-？
-webkit-column-count: 3; -webkit-column-gap: 10px; -webkit-column-fill: auto; -moz-column-count: 3; -moz-column-gap: 10px; -moz-column-fill: auto; 我是一个在CSS初学者，当我有一天在看一些CSS代码，我发现这些线。 在我用来学习CSS的教程中，我从来没有见过类似这些行的东西。 有人可以向我解释这些行或给我一个来源，我可以学习实现这样的线？
提前致谢！
这些是由相关渲染引擎（ -webkit for Chrome，Safari; -moz for Firefox， -o用于Opera， -ms用于Internet Explorer）提供的供应商前缀属性。 通常在W3最终澄清/定义之前，它们被用来实现新的或专有的CSS特性。
这允许为每个单独的浏览器/渲染引擎设置属性，以便实现安全性之间的不一致。 随着时间的推移，前缀将会被删除（至less在理论上），因为在该浏览器中实现了该属性的前缀，最终版本。
为此，通常认为好的做法是首先指定供应商前缀的版本，然后指定非前缀的版本，以便非前缀属性在实现后会覆盖供应商的前缀属性设置; 例如：
.elementClass { -moz-border-radius: 2em; -ms-border-radius: 2em; -o-border-radius: 2em; -webkit-border-radius: 2em; border-radius: 2em; }
具体而言，要解决您的问题中的CSS，您引用的行：
-webkit-column-count: 3; -webkit-column-gap: 10px; -webkit-column-fill: auto; -moz-column-count: 3; -moz-column-gap: 10px; -moz-column-fill: auto;
指定Webkit浏览器和Firefox的column-count ， column-gap和column-fill属性。
参考文献：
- CSS多列布局模块 。
- “捍卫供应商前缀”（Meyerweb.com） 。
- 供应商前缀列表（Meyerweb.com） 。
什么是-moz-和-webkit-？
以-webkit- ，- -moz- ，- -ms-或-o-开头的CSS属性称为供应商前缀。
为什么不同的浏览器添加不同的前缀相同的效果？
供应商前缀的一个很好的解释来自QuirksMode的 Peter-Paul Koch：
最初，供应商前缀的目的是让浏览器制造商开始支持实验性的CSS声明。
假设W3C工作组正在讨论一个网格声明（顺便说一下，这不是一个坏主意）。 我们还要说有些人制定了一个规范草案，但其他人不同意一些细节。 我们知道，这个过程可能需要很长时间。
我们还要说，微软作为一个实验决定实施提议的网格。 在这个时候，微软不能确定该规范是不会改变的。 因此，不添加网格到它的CSS，它增加了
-ms-grid。供应商前缀种说：“这是微软正在进行的提案的解释”。 因此，如果网格的最终定义不同，Microsoft可以添加新的CSS属性网格，而不会打破依赖于-ms-grid的页面。
更新截至2016年
作为这篇文章3年，重要的是要提到，现在大多数供应商确实知道这些前缀只是创build不必要的重复代码，并且你需要指定3个不同的CSS规则，以获得一个效果在所有浏览器中工作的情况是一个不需要的。
如本词汇表中提到的关于May 3, 2016年May 3, 2016 Mozilla对Vendor Prefix的看法，
浏览器供应商现在正试图摆脱供应商前缀的实验function。 他们注意到Web开发人员在生产网站上使用它们，污染了全球空间，并使得劣势更加困难。
例如，就在几年前，为了在一个盒子上设置一个圆angular，你必须写：
-moz-border-radius: 10px 5px; -webkit-border-top-left-radius: 10px; -webkit-border-top-right-radius: 5px; -webkit-border-bottom-right-radius: 10px; -webkit-border-bottom-left-radius: 5px; border-radius: 10px 5px;
但现在浏览器已经完全支持这个function，你真的只需要标准化的版本：
border-radius: 10px 5px;
为所有浏览器find正确的规则
虽然在所有浏览器上都没有通用的CSS规则标准，但是可以使用像caniuse.com这样的工具来检查所有主stream浏览器对规则的支持。
你也可以使用pleeease.io/play 。 Pleeease是一个可以轻松处理CSS的Node.js应用程序。 它简化了预处理器的使用，并将它们与最好的后处理器相结合。 它有助于创build干净的样式表，支持较旧的浏览器并提供更好的可维护性。
input：
a { column-count: 3; column-gap: 10px; column-fill: auto; }
输出：
a { -webkit-column-count: 3; -moz-column-count: 3; column-count: 3; -webkit-column-gap: 10px; -moz-column-gap: 10px; column-gap: 10px; -webkit-column-fill: auto; -moz-column-fill: auto; column-fill: auto; }
