CSS供应商前缀列表?

时间:2011-03-23 20:11:17

标签: css vendor-prefix

除了以下列表之外,还有其他CSS供应商前缀对 Web开发很重要吗?我的定义是否正确?我应该更具体地了解移动浏览器(移动Webkit,例如)

  • -khtml-(Konqueror,真的旧的Safari)
  • -moz-(Firefox)
  • -o-(歌剧)
  • -ms-(Internet Explorer)
  • -webkit-(Safari,Chrome)

this list(还包含mso--wap--atsc-)是否会添加任何有价值的内容?

3 个答案:

答案 0 :(得分:98)

这些是我所知道的:

  • -ms- Microsoft
  • mso- Microsoft Office
  • -moz- Mozilla Foundation(基于Gecko的浏览器)
  • -o--xv- Opera Software
  • -atsc-高级电视标准委员会
  • -wap- WAP论坛
  • -webkit- Safari,Chrome(以及其他基于WebKit的浏览器)
  • -khtml--konq- Konqueror浏览器
  • -apple- Webkit也支持使用-apple-前缀的属性
  • prince- YesLogic
  • -ah- Antenna House
  • -hp- Hewlett Packard
  • -ro-真实物件
  • -rim- Research In Motion
  • -tc-高大的组件

这些正式列在CSS 2.1 Specification, informative section 4.1.2.2

答案 1 :(得分:1)

虽然不在Web开发的直接上下文中,但JavaFX也使用供应商前缀来使用CSS:-fx-

答案 2 :(得分:1)

只是一个建议,如果您计划只添加一个css过渡前缀,请假设column-count: 3;并且您希望支持所有主要浏览器,并在您的属性前加上所有在这里的答案中提到的前缀,然后一个更好,更优化的方法是使用一个工具,为你做到这一点:

您可以使用类似pleeease.io的在线广告代码进行转换:

<强>输入

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;
}