diff options
author | Peter Bengtsson <mail@peterbe.com> | 2020-12-08 14:40:17 -0500 |
---|---|---|
committer | Peter Bengtsson <mail@peterbe.com> | 2020-12-08 14:40:17 -0500 |
commit | 33058f2b292b3a581333bdfb21b8f671898c5060 (patch) | |
tree | 51c3e392513ec574331b2d3f85c394445ea803c6 /files/zh-cn/glossary/vendor_prefix | |
parent | 8b66d724f7caf0157093fb09cfec8fbd0c6ad50a (diff) | |
download | translated-content-33058f2b292b3a581333bdfb21b8f671898c5060.tar.gz translated-content-33058f2b292b3a581333bdfb21b8f671898c5060.tar.bz2 translated-content-33058f2b292b3a581333bdfb21b8f671898c5060.zip |
initial commit
Diffstat (limited to 'files/zh-cn/glossary/vendor_prefix')
-rw-r--r-- | files/zh-cn/glossary/vendor_prefix/index.html | 77 |
1 files changed, 77 insertions, 0 deletions
diff --git a/files/zh-cn/glossary/vendor_prefix/index.html b/files/zh-cn/glossary/vendor_prefix/index.html new file mode 100644 index 0000000000..cdf72cc791 --- /dev/null +++ b/files/zh-cn/glossary/vendor_prefix/index.html @@ -0,0 +1,77 @@ +--- +title: 浏览器引擎前缀 +slug: Glossary/Vendor_Prefix +tags: + - 术语 +translation_of: Glossary/Vendor_Prefix +--- +<p>浏览器厂商们有时会给实验性的或者非标准的 CSS 属性和 JavaScript API 添加前缀,这样开发者就可以用这些新的特性进行试验,同时(理论上)防止他们的试验代码被依赖,从而在标准化过程中破坏 web 开发者的代码。开发者应该等到浏览器行为标准化之后再使用未加前缀的属性。</p> + +<div class="note"> +<p>浏览器厂商们正在努力停止使用前缀来表示实验性质的代码的行为。Web开发者一直在生产环境的网站上使用这些实验性代码,这使得浏览器厂商更难保证浏览器兼容性和处理新特性;这也伤害了更小众的浏览器,它们被迫添加其他浏览器前缀以加载热门网站。</p> + +<p>现在的趋势是将实验性功能添加在需要用户自行设置偏好或标记(flag)的地方,同时编写一个更小规模的规范,以更快达到稳定状态。</p> +</div> + +<h2 id="CSS_前缀">CSS 前缀</h2> + +<p>主流浏览器引擎前缀:</p> + +<ul> + <li><code>-webkit-</code> (谷歌,Safari,新版Opera浏览器,以及几乎所有iOS系统中的浏览器(包括 iOS 系统中的火狐浏览器);基本上所有基于WebKit 内核的浏览器)</li> + <li><code>-moz-</code> (火狐浏览器)</li> + <li><code>-o-</code> (旧版Opera浏览器)</li> + <li><code>-ms-</code> (IE浏览器 和 Edge浏览器)</li> +</ul> + +<p>示例:</p> + +<pre class="notranslate"><em>-webkit-</em>transition: all 4s ease; +<em>-moz-</em>transition: all 4s ease; +<em>-ms-</em>transition: all 4s ease; +<em>-o-</em>transition: all 4s ease; +transition: all 4s ease; </pre> + +<h2 id="API_前缀">API 前缀</h2> + +<p>过去,浏览器引擎也使用前缀修饰实验性质的API。如果整个接口都是实验性的,前缀修饰的就是接口名(但不包括其中的属性或者方法)。如果将一个实验性的接口或者方法添加到一个标准化的接口中,这个新增的接口或者方法被前缀修饰。 </p> + +<h3 id="接口前缀">接口前缀</h3> + +<p>需要使用大写的前缀修饰接口名:</p> + +<ul> + <li><code>WebKit</code> (谷歌, Safari, 新版Opera浏览器, 以及几乎所有iOS系统中的浏览器(包括iOS 系统中的火狐浏览器); 简单的说,所有基于WebKit 内核的浏览器)</li> + <li><code>Moz</code> (火狐浏览器)</li> + <li><code>O</code> (旧版Opera浏览器)</li> + <li><code>MS</code> (IE浏览器 和 Edge浏览器)</li> +</ul> + +<h3 id="属性和方法前缀">属性和方法前缀</h3> + +<p>需要使用小写的前缀修饰属性或者方法</p> + +<ul> + <li><code>webkit</code> (谷歌, Safari, 新版Opera浏览器, 以及几乎所有iOS系统中的浏览器(包括iOS 系统中的火狐浏览器); 简单的说,所有基于WebKit 内核的浏览器)</li> + <li><code>moz</code> (火狐浏览器)</li> + <li><code>o</code> (旧版Opera浏览器等</li> + <li><code>ms</code> (IE浏览器 和 Edge浏览器)</li> +</ul> + +<p>示例:</p> + +<pre class="brush: js notranslate">var requestAnimationFrame = window.requestAnimationFrame || + window.mozRequestAnimationFrame || + window.webkitRequestAnimationFrame || + window.oRequestAnimationFrame || + window.msRequestAnimationFrame;</pre> + +<h2 id="了解更多">了解更多</h2> + +<h3 id="基础知识">基础知识</h3> + +<ul> + <li><span>维基百科{{Interwiki("wikipedia", "CSS_hack#Browser_prefixes", "浏览器引擎前缀(</span>Vendor prefix<span>)")}} </span></li> +</ul> + +<p>{{QuickLinksWithSubpages("/zh-CN/docs/Glossary")}}</p> |