Question

例如，如果我想在Webkit中设置角半径，Firefox和其他我可以使用以下CSS：

-webkit-border-radius: 8px;
-moz-border-radius: 8px;
border-radius: 8px;

但这些样式是硬编码还是只是添加了浏览器的前缀地址？

例如，如果我只想在Firefox中更改边距，我可以简单地添加前缀：

-moz-margin:-4px;
margin: 1px;

NICE TO KNOW：
如果可能的话，可以解决特定的版本或平台？例如，-moz-4.3-margin:-4px;不是我想要的，只是想知道。

前缀方法是否跨浏览器工作？我想知道因为Internet Explorer。

最后，margin:10px是否会淘汰-moz-margin:10px？正如在“我们，Mozilla，最后支持margin所以我们将忽略所有旧的-moz-margin标记，并且只使用margin标记中的值”。

Answer 1

将css应用于特定浏览器是非常糟糕的习惯。但也有解决方案：

只有Moz：

@-moz-document url-prefix(){
    body {
        color: #000;
    }
    div{
       margin:-4px;
    }
}

chome and safari：

@media screen and (-webkit-min-device-pixel-ratio:0) {
    body {
        color: #90f;
    }
}

IF9以下：

<!--[if IE 9]>
    body {
        background:red;
    }
<![endif]-->

我建议不要使用此moz和safari前缀，除非必要。

Answer 2

例如，如果我想在Webkit中设置角半径，Firefox和其他我可以使用以下CSS

不，这不是它的工作方式。

供应商前缀属性用于实验性功能。要么是因为该属性的规范没有被锁定，要么因为浏览器实现者知道他们的实现存在问题。

一般情况下，您不应该在生产代码中使用它们，因为它们是 experimental 。

随着支持稳定，支持供应商前缀版本已移除。

有没有办法为CSS中的特定浏览器设置任何样式？

有几种方法可用于此效果。

Parser bug

通过利用特定CSS引擎中的错误或不支持的功能（例如，某些版本的IE将忽略属性名称前面的*字符，而其他浏览器将（正确地）丢弃整个规则）。

条件评论

较旧版本的Internet Explorer支持扩展HTML注释语法，可用于为某些版本的IE添加<link>或<style>元素。

对此的支持已被取消。

的JavaScript

在JS中进行浏览器检测后，可以使用JavaScript将类添加到元素（通常是body元素）。

Answer 3

据我所知，当CSS3由不同的浏览器实现时，前缀被添加到属性中，只有属性不起作用所以我们使用 -prefix-property < / em>对于某些属性，如渐变或边界半径。对于大多数浏览器而言，它们中的大多数现在都没有前缀，并且前缀系统只是为了向后兼容而保留。

例如，如果我只想在Firefox中更改边距，我可以简单地添加前缀：

-moz-余量：-4px;      保证金：1px;

这不起作用。但是，您可以以这种方式为不同的浏览器（例如IE）使用不同的样式表：



浏览器特定的前缀版本不存在。

希望这能回答你的问题。

有没有办法为CSS中的特定浏览器设置任何样式？

3 个答案: