Mozilla中的CSS边框半径

Question

在下面给出的页面中，#topnav的边框半径在Mozilla中无效，但在Google Chrome中有效。 我使用以下CSS代码：

http://www.kbay.in

#topnav { display:inline-block;float: right; text-align: right; background: #e4f4fe; 
    border:1px solid #e4f4fe;
    border-bottom-color: #e4f4fe;
    border-bottom-width: 4px;
    border-bottom-style: solid; 
    border-radius: 0px 0px 15px 15px; 
    -moz-border-radius-bottomleft: 15px; 
    -moz-border-radius-bottomright: 15px;
    -webkit-border-bottom-right-radius: 15px;
    -webkit-border-bottom-left-radius: 15px;
    margin-right: 90px; margin-top: 0px;
    width:265px;}5E9DC8

- Junaid Inayati

Answer 1

新版本的Firefox现在有了未加前缀的 border-radius 版本。

尽管旧版是

-moz-border-radius-bottomleft: 15px;

现在您需要采取

border-bottom-left-radius: 15px;

这是为了新版Firefox而做的。这就是为什么你总是要声明正式版本为最后一个（这样就不会发生覆盖）。

-moz-border-radius-bottomleft: 15px; 
-moz-border-radius-bottomright: 15px;
-webkit-border-bottom-right-radius: 15px;
-webkit-border-bottom-left-radius: 15px;
/*last border-radius declaration has to be the standard one*/
border-radius: 0px 0px 15px 15px;

然而，它仍应该起作用。也许你有其他规则覆盖了这个？(示例) 此外，请删除您规则块后面的 5E9DC8。

顺便说一下，如果您只选择简写符号，那么您就安全了，因为它没有符号差异。

- Christoph

---

根据该规则，你有一个字符串 - 删除它。 - Christoph

你是指这个字符串吗: -moz-border-radius: 0像素 0像素 15像素 15像素; ?? - Junaid Inayati

不，块后面：5E9DC8 - Christoph

哦...我重置了浏览器缓存，它就像魔法一样奏效了..谢谢你！ :) - Junaid Inayati

Answer 2

是的，现在，随着最新的浏览器版本，旧的前缀（-o，-moz，-webkit）已被删除， 只需为所有新浏览器（ie，opera，chrome和firefox）使用“border-radius”，这是一个{{link1：W3C规范}} 但是，对于“旧”浏览器，请继续使用旧的前缀，

有一个特定的网站可以生成CSS边框半径代码{{link2：就在这里}}。

- Doc Roms