css - 为什么不同浏览器的 CSS3 语法不同？

Question

我是 HTML5 和 CSS3 的新手。我刚刚看到一些 CSS3 代码，如下所示:

.box
    {
        border-top-left-radius:5px;
        -webkit-border-bottom-left-radius:5px; 
        -moz-border-top-left-radius:5px;
         border:1px solid #8e8e8e;
         background-color:white;
         height:16px;
         padding:4px;
         padding-left:28px;
         padding-right:10px;
         color:#4a4a4a;
         float:left;

     }

我不明白为什么在 border-top-left-radius 边界半径之后提到了 -moz 和 -webkit 前缀？不同浏览器的语法是否不同？现在标准化了吗？

Answer 1

是的，语法可能因实验属性而异。这完全由供应商决定，因为以供应商为前缀的属性被认为是专有的，而不是标准的一部分。

特别是，Mozilla 将其称为 -moz-border-radius-topleft，而不是 -moz-border-top-left-radius。您正在查看的代码是错误的(可能是盲目复制和粘贴声明的结果)。

它已被标准化为 border-top-left-radius。前缀属性仅用于支持旧版本的浏览器。就此而言，无前缀属性应该放在最后，以确保浏览器对属性的最佳/最稳定实现。