【问题标题】:CSS: How to set up border radius cross browser (only IE8 and IE9 missing ?)CSS:如何设置边框半径跨浏览器(仅缺少 IE8 和 IE9?)
【发布时间】:2015-06-17 19:26:01
【问题描述】:

我创建了自己的按钮并设置了一些简单的边框半径。

到目前为止,我有以下在较新的浏览器中可以正常工作,但我不确定我必须在此处添加什么以涵盖 IE8 和 IE9(我对旧版本不感兴趣)。

谁能告诉我是否需要在此处添加或更改任何其他内容以涵盖常见的浏览器?
我想支持较新版本的 Chrome、Firefox、Opera 和 Safari + IE(包括 IE8 和 IE9)。
IE10 是否需要“-ms-...”,Opera 是否需要“-o-...”?
我不想介绍 Netscape 和 Konqueror(除非有人推荐)。

我的 CSS:

-moz-border-radius: 5px; /* Firefox */
-webkit-border-radius: 5px; /* Safari */
-webkit-appearance: none;               
border-radius: 5px;

提前非常感谢, 迈克

【问题讨论】:

  • border-radius 与大多数 current browsers 一样工作,您不再需要使用浏览器前缀。

标签: css internet-explorer-8 internet-explorer-9 border internet-explorer-10


【解决方案1】:

您不能在纯 CSS 中涵盖 IE8,因为它既不支持 final 也不支持以供应商为前缀的实现。 IE9 支持就好了。

您可以在此处查看完整的支持表:

http://caniuse.com/#search=border-radius

因此,根据此表,要回答您的问题,对于 IE10 和 -o-.. 对于 Opera,您不需要 -ms-...。

【讨论】:

  • 谢谢!以上是否涵盖了其余部分,即 IE9 中的 FF、Chrome、Opera、Safari 和 IE?
  • 您只需要border-radius: 5px; 即可覆盖所有这些浏览器
  • @Wojciech Maj:感谢您的更新——这正是我想要的。我会尽快接受。 :)
  • @Pythonic1:谢谢 - 所以我什至不需要 -moz-... 和 -webkit-... 了?这仅适用于非常旧的浏览器版本吗?
  • 当然。如果我是你,我只会输入border-radius,根本没有供应商前缀,除非你真的非常想支持 Firefox 3.6 及更早版本(0.06% 的用户)或 Chrome 4(0.01% 的用户),那么你可以离开 -moz- 和 -webkit-。 -ms- 和 -o- 并不是一个真正的东西。
猜你喜欢
  • 2015-09-03
  • 2012-07-02
  • 1970-01-01
  • 2021-12-02
  • 2011-11-14
  • 2011-07-19
  • 1970-01-01
相关资源
最近更新 更多