Question

我是CSS3概念的新手，我正在努力理解它。

我认为使用CSS3的主要好处是它消除了使用图像做渐变，圆形边框等操作

我的问题是，如果我想支持旧浏览器，比如IE8，我的选择是什么;

它是否会自动回退到较旧的borwsers上的某些渲染（例如正常边框而不是圆角）

我可以使用其他一些库在旧的IE浏览器（例如圆形边框）上获得相同的效果吗？（即IE上的圆形边框或渐变）

在CSS3示例中，我看到很多东西或属性，如-webkit，-moz，-o等，这些用于什么？是否有任何特定的顺序需要这些具有较旧的IE后备支持？

Answer 1

在大多数情况下是的。有时浏览器的部分实现可能与大多数其他实现不同。你可以在这个很棒的资源上检查CSS3支持 - Can I use? - border radius 它显示每个浏览器/每个版本的信息，有关于部分支持的注释并显示全局支持百分比。
要在旧版浏览器上实现回退，您可能需要使用Modernizr等功能检测库。它基于用户客户端及其CSS3支持向html元素添加了一堆css类。 e.g。

<html class="js no-touch postmessage history multiplebgs boxshadow opacity cssanimations csscolumns cssgradients csstransforms ....

当涉及到回退的实现时，每种不同的情况都有不同的技术。以下是使用Modernizr进行背景渐变的后备示例：
```
/* 1px wide bg.png image with gradient stretched to div width */
.no-cssgradients div.header {
    background: url(images/bg.png) repeat-x;
}

/* 
   IE-specific implementation 
   Uses filters supported only by IE browsers
*/

.no-cssgradients div.header {
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#1e5799', endColorstr='#7db9e8',GradientType=0 );
}
```
您可以采用的下一种技术是使用条件注释检测IE版本。您必须在index.html
之上添加以下代码
```



 <html class="no-js" lang="en"> 
```
现在每个特定版本都有自己的lt-*类。之后我创建iefixes.css文件，我把所有讨厌的修复程序放在那里。它非常方便，因为所有黑客都在一个地方，只要您放弃对某些版本的支持，您就可以轻松删除其中的一部分，甚至删除整个文件。 e.g。
```
/* Applied for all IE version < 9 (IE6-8) */
.lt-ie9 .header {
    margin-left: 20px;
}
```
How to create IE-only stylesheet
这些是CSS供应商前缀。 CSS浏览器前缀是浏览器供应商添加对新CSS功能的支持的一种方式。浏览器前缀用于添加可能不是正式规范的一部分的新功能，以及在尚未最终确定的规范中实现功能。申请顺序没有差异。 Source

有许多工具可以自动添加供应商前缀，您可能希望在构建期间预处理css源，然后您不必自己维护它们。

Prefixfree / Autoprefixer

Answer 2

1）是的，尽管你的里程可能会有所不同。有时它会像你建议的那样回落，有时它会变得疯狂（如果你做的事情特别复杂）。有些事情（例如动画）没有等效的回退。

2）你最好的选择是http://css3pie.com/ - 一个快速插件，可以为大型IE浏览器添加（大多数）css3选项。大多数国家的IE8使用率相当低（全球约15％），但如果国际市场受到关注，Raptor在中国这样的地方指出仍然很高。具有讽刺意味的是，你可能更多地停留在IE6上，因为仍然有一些公司因为传统代码而使用它。

3）前缀是使CSS3在某些浏览器上运行所必需的。可以在W3 Scools和Can I Use找到当前所需内容的列表，但现在很多都已删除，您可以使用vanilla版本。

Answer 3

是的，但并非所有CSS3属性都被识别，例如关键帧动画
取决于哪种效果。有些图书馆正在这样做。
这些是特定于供应商的属性。在较旧的浏览器/那些不支持CSS标准的浏览器中，他们采用这些特定于供应商的属性来显示CSS属性。 MDN有一个非常详细的CSS部分，用于说明哪些CSS需要特定于供应商的属性，哪些不需要。

旧版浏览器支持CSS3

3 个答案: