css3兼容css2的语法吗

html-css025

css3兼容css2的语法吗,第1张

兼容。css3的性能是很好的，它是可以兼容css2的语法的，有这个能力的。CSS3是CSS（层叠样式表）技术的升级版本，于1999年开始制订，2001年5月23日W3C完成了CSS3的工作草案。

CSS（Cascading Style Sheets ）叫层叠样式表，用于修饰HTML文档样式；CSS3是CSS2的升级版本，由CSS权威组织在css2的基础之上新增了很多功能和标准，让各大浏览器厂商去实现。但是由于各浏览器出于各种原因，导致对各个功能的实现的时间是参差不齐的，这就导致有些浏览器先实现，有些浏览器后实现，甚至有些浏览器没实现；先实现的浏览器将已经实现的功能做个特殊的标记，表示这个功能是我的私有属性，其他浏览器用不了；而接着如果第二个浏览器也实现了这个功能，它也加一个自己的特殊标记，以此类推，到最后面所有浏览器厂商都实现了该功能。这个时候某个浏览器厂商的人可能就想到，这个功能大家都实现了那这也不算是我的私有属性了，那我就支持不加自己特殊标记的写法吧，接着第二个厂商看到，哟呵是哦大家都实现了，那我也支持不加自己特殊标记的写法，以此类推，到最后大家都支持不加自己特殊标记的写法了，这就是一个属性从开始定义到兼容一些浏览器到兼容所有浏览器的过程。这个过程，甚至到现在很多属性和功能都是在上述的发展着。

所以正是浏览器厂商对CSS3新增功能的实现时间参差不齐，导致了CSS3属性各种各样不兼容的问题。

那如何解决兼容性紊乱的问题呢？

方法一：查文档查手册

下面是两个最常用的两个网址caniuse和CSS手册：

当我们要用某个属性的时候，就去上面两个网址查找该属性的兼容性，对应你要兼容到的浏览器版本，对应的加上前缀之类的操作，如columns：

小结一下，各主流浏览器常加的特殊标记：

1. Safari/Chrome: -webkit-

2. IE:-ms-

3. Firefox:-moz-

4. Opera:-o-

方法二：使用后处理器比如autoprefixer插件自动补齐前缀

这里简单讲一下后处理器和预处理器

注意：cssNext和autoprefixer依赖于postCss

postCss的本质是用js实现的CSS的抽象语法树（AST : Abustract Syntax Tree）

说白了postCss就像一个插槽一样，剩下的具体事情留个其他插件来做了，cssNext和autoprefixer就是它其中的两个插件

原先基于css2设计的网页在css3中显示如下。

1、html做布局(超文本标记语言，标准通用标记语言下的一个应用。超文本就是指页面内可以包含图片、链接，甚至音乐、程序等非文字元素。

2、javascript或者jquery添加切换效果(javascript一种直译式脚本语言，是一种动态类型、弱类型、基于原型的语言，内置支持类型。它的解释器被称为javascript引擎，为浏览器的一部分，广泛用于客户端的脚本语言，最早是在html标准通用标记语言下的一个应用)网页上使用，用来给html网页增加动态功能。