Question

我正在研究一些网站如何实现圆角，而CSS有这些奇怪的标签，我以前从未见过。

-moz-border-radius-topright: 5px;
-webkit-border-top-right-radius: 5px; 
-moz-border-radius-bottomright: 5px;
-webkit-border-bottom-right-radius: 5px;

我用Google搜索，它们似乎是Firefox特定的标签？

更新

我看到的网站是推特，很奇怪这样的网站会疏远他们的IE用户。

Answer 1

-moz-*属性仅限Gecko（Firefox，Mozilla，Camino），-webkit-*属性仅限WebKit（Chrome，Safari，Epiphany）。特定于供应商的前缀通常用于实现尚未由W3C标准化的CSS功能。

Twitter不会“疏远”他们的IE用户。只需为支持它的浏览器添加样式。

Answer 2

-moz是firefox特有的，-webkit是针对safari，chrome和其他一些使用该渲染引擎的浏览器。

这些是在CSS3中定义的属性的早期实现，因此它们将来会在没有前缀的情况下出现。

Answer 3

我建议从IE或其他浏览器浏览网站。我打赌你会得到不同的标记。

Answer 4

这些适用于Firefox（标记为-moz-border）和Safari（-webkit-border）。

Answer 5

是的，前面带有-moz的任何内容都只适用于Firefox。

-webkit仅适用于Safari，Chrome或Webkit等基于webkit的浏览器。

有关使用普通css标记制作圆角的多种方法，请参阅here。

编辑：我不认为没有圆角是完全疏远，只是略微不同的IE外观。

如果有人想知道，请填写所有-moz和-webkit css样式的完整列表

圆角，这个Mozilla具体吗？

5 个答案: