当CSS属性以短横线开头时,这意味着它是一个自定义属性。

5

我刚从这个网站下载了一个css文件,其中包含-webkit-transform-moz-transform等属性。破折号代表什么意思,在什么情况下需要使用它?

就细节而言,“厂商前缀”这个短语是指破折号还是破折号之间的内容(不包括破折号本身),或者是破折号及其之间的内容(包括破折号本身)?

换句话说,厂商前缀是指破折号本身还是只包括破折号之间的内容或者是破折号与之间的内容?


1
如果你想深入了解这种浏览器hack,可以查看http://browserhacks.com/。 - Sven
2个回答

7

-webkit--moz- 被称为浏览器前缀;它们通常表示 CSS 的浏览器特定功能,或者是正在开发/草案阶段的功能,还不能被视为标准。当这些功能被“提前使用”时,有时唯一使其在每个浏览器中工作的方法是为每个浏览器提供具有不同前缀的不同规则 - 这就是您在项目中看到的内容。这个想法是最终,这个功能将被标准化,浏览器将删除前缀,生活将继续。

例如,-webkit-gradient 是定义 CSS 渐变的第一种方式,但已被完全不同的 linear-gradientradial-gradient 语法所取代。

如果您要在确定的标准或全局无前缀浏览器支持之前使用某个功能,则了解哪些浏览器支持该功能以及您需要哪些前缀的便捷方法是 Can I Use…

一些常见的前缀包括:

  • -webkit- 适用于基于 WebKit 的浏览器,包括 Chrome/Chromium 和 Safari
  • -moz- 适用于 Firefox
  • -ms- 适用于 Internet Explorer(9 及以上版本)
  • -o- 适用于 Opera(WebKit之前的版本)

2
它们被称为供应商前缀。不同的浏览器有不同的前缀:
-webkit- - 基于Webkit的浏览器,如Safari和Chrome -moz- - 基于Gecko的浏览器,如Firefox
-ms- - Internet Explorer -o- - 基于Presto的浏览器,如Opera
供应商前缀用于表示实验性CSS特性。当特定属性或规范不稳定且可能在未来发生变化时,它们会被使用。通过使用前缀,浏览器可以尝试该特性,而无需担心开发人员将使用该属性并且如果行为或语法发生更改,则网站将中断。一旦规范变为最终版本,前缀将被删除,并且某些浏览器将删除对前缀版本的支持。
W3C的官方指导意见是,在属性或特性所属的规范达到候选推荐阶段之前应使用前缀。
通常最佳实践是按顺序使用所有供应商前缀,最后使用未加前缀的版本。
Mozilla和Chrome(现在他们正在转向Blink引擎)已经改变了策略,将该特性隐藏在标志后面,而不是使用前缀。这意味着除非用户启用该标志,否则无法使用该功能。
更多信息,请参见CSS工作组的维基页面:http://wiki.csswg.org/spec/vendor-prefixes

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接