CSS什么是-moz-和-webkit-? [英] CSS What are -moz- and -webkit-?

查看:148
本文介绍了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,我从来没有见过这样的线。有人可以向我解释这些线或给我一个源,我可以学习实现这样的线吗?

I am a beginner at css and when I was looking at some css code the other day, I found these lines. In the tutorials I used to learn css, I have never seen anything like these lines. Could someone please explain these lines to me or give me a source where I could learn to implement lines like these?

提前感谢!

推荐答案

这些是由相关呈现引擎提供的供应商前缀属性( -webkit ; Firefox的 -moz ,Opera的 -o -ms Internet Explorer)。通常,它们用于在W3进行最终澄清/定义之前实现新的或专有的CSS功能。

These are the vendor-prefixed properties offered by the relevant rendering engines (-webkit for Chrome, Safari; -moz for Firefox, -o for Opera, -ms for Internet Explorer). Typically they're used to implement new, or proprietary CSS features, prior to final clarification/definition by the W3.

这允许为每个单独的浏览器设置属性/渲染引擎,以便实现之间的不一致性被安全地考虑。前缀将随着时间的推移被移除(至少在理论上),因为属性的无前缀,最终版本在该浏览器中实现。

This allows properties to be set specific to each individual browser/rendering engine in order for inconsistencies between implementations to be safely accounted for. The prefixes will, over time, be removed (at least in theory) as the unprefixed, the final version, of the property is implemented in that browser.

通常认为良好的做法是首先指定供应商加前缀的版本,然后再指定非加前缀的版本,以便非加前缀的属性在实现后将覆盖供应商加前缀的属性设置;例如:

To that end it's usually considered good practice to specify the vendor-prefixed version first and then the non-prefixed version, in order that the non-prefixed property will override the vendor-prefixed property-settings once it's implemented; for example:

.elementClass {
    -moz-border-radius: 2em;
    -ms-border-radius: 2em;
    -o-border-radius: 2em;
    -webkit-border-radius: 2em;
    border-radius: 2em;
}

具体来说,为了解决你的问题中的CSS, / p>

Specifically, to address the CSS in your question, the lines you quote:

-webkit-column-count: 3;
-webkit-column-gap: 10px;
-webkit-column-fill: auto;
-moz-column-count: 3;
-moz-column-gap: 10px;
-moz-column-fill: auto;

指定 column-count ,<$ Webkit浏览器和Firefox的 column-gap 和 column-fill 属性。

参考文献:

  • CSS Multi-column layout module.
  • 'In defence of Vendor Prefixes' (Meyerweb.com).
  • Vendor prefix lists (Meyerweb.com).

这篇关于CSS什么是-moz-和-webkit-?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆