有时候当你发现你写的样式代码并没有如期执行时，很可能是你打错字了。但是其他元素的样式并没有失效，这跟其他语言还是有区别的，比如C，语法出错编译就会报错，更别说执行了。CSS对于语法错误有它自己的解析机制，下面我们就来探讨一下。
1.错误处理
要想解析语法错误，首先得明白语法，一些基本的用法这里就不说了，说些关键点：
1.注意关键字的使用。不要在关键字外加引号。比如：color:"red";是不对的。
2.支持厂商对关键字的扩展。比如_height在非IE浏览器下是非法无效的，但在IE6下却是有效的。利用这个特性衍生出了 css hack。
3.对于html，CSS是大小写不敏感的。但是对于XML却相反。
4.@规则：@+标识符（比如@import）。CSS 2.1 user agents must ignore any '@import' rule that occurs inside a block or after any non-ignored statement other than an @charset or an @import rule.
举个例子：
@import "subs.css";
h1 { color: blue }
@import "list.css";CSS会忽略第二个@import。上面这段代码等效于：
@import "subs.css";
h1 { color: blue }有种情况例外，就是在import后面加了media type类型指定样式媒体目标。比如：
@import "subs.css";
@import "print-main.css" print;/*此段有效*/
@media print {
body { font-size: 10pt }
}
h1 {color: blue }css对于错误的处理态度就是无视之，下面看看都有哪些情况。
1.1未知属性和非法值
忽略未知属性和非法值，如果你写了mheight:100px;;这样的代码，CSS会直接忽略它,因为mheight是未知属性。同样，height:100kg;也会被无视，因为100kg是非法值。但是，之前说了CSS支持厂商对关键字的扩展，所以某些属性对一般浏览器是未知的，但对于特定浏览器却是正确的，比如IE6的*height。
1.2畸形的声明
浏览器解析声明时会检测其()、{}、“”[]等匹配规则，遇到错误浏览器必须进行处理，但是怎么处理标准并没有说。比如p{color}会被无视。
1.3@+不可用的标识符
@import没错，@important就不对了。1.4样式表的意外结尾
标准规定浏览器必须关闭需要成对出现的结构。比如：
@media screen {
p:before { content: 'Hello
需要被解析成：
@media screen {
p:before { content: 'Hello'; }
}但是，很多浏览器并没有按标准来修复它。1.5意外的字符串结尾
如果字符串结尾没有引号关闭它，浏览器必须要关闭它并忽略此段非法声明。
p {
color: green;
font-family: 'Courier New Times
color: red;
color: green;
}需要被解析成： p { color: green; color: green; }但是，很多浏览器并未按标准来修复它。说了这么多，其实我只想说一句：非法的都忽略！所以不用担心写错一个字而让浏览器崩溃。至于标准所说的错误解析规则很多浏览器并没有实现这一点，我觉得也不重要，因为你就不应该犯这种低级错误！
2.基本数据类型
这节跟上节基本没啥关系啊，标准放在了同一章，这里就一起讲吧....
2.1整数和实数
就是数值嘛~，整数，小数，负数都支持啦~
2.2长度值
长度值的格式：数值+单位。如果数值为0，单位可有可无。
单位又分为相对单位和绝对单位，相对单位有：
em：em长度等效于作用在该节点"font-size"上的值。比如：
div{
font-size:10px;
height:2em;/*这里等价于20px*/
}ex:ex长度相对于一个小写字母x的高度。通常被用在内容不包含"x"的元素上，这.....，不知道为什么会有这么奇葩的相对单位，反正没怎么见过。绝对单位比较多：
in：英寸，等效于2.54cm；
cm：厘米，等效于10mm；
mm：毫米；
pt：点，等效于1/72 in；
pc：皮卡，等效于1/6 in；
px：像素，等效于0.75pt；
绝对单位都可以相对转换，用起来也比较简单，由于开发都是基于screen的，所以只用到了px.
2.3百分值
数值+%，怎么用大家都知道的。
2.4 URL和URI
URL统一资源定位符和URI统一资源标识符，这也算是基本单位.....二者的关系就不多说了。
2.5 Counters
这个属性之前没用过也没见过，脑补一下：
counters计数器可以对标签自动排序，通过counter-reset属性和counter-increment属性结合来实现。
counter-reset 属性
用法：counter-reset 属性设置某个选择器出现次数的计数器的值。默认为 0。
说明：利用这个属性，计数器可以设置或重置为任何值，可以是正值或负值。如果没有提供 number，则默认为 0。
注释：如果使用display: none，则无法重置计数器。如果使用visibility: hidden，则可以重置计数器。
用法：counter-reset 属性设置某个选择器出现次数的计数器的值。默认为 0。
说明：利用这个属性，计数器可以设置或重置为任何值，可以是正值或负值。如果没有提供 number，则默认为 0。
注释：如果使用display: none，则无法重置计数器。如果使用visibility: hidden，则可以重置计数器。
counter-increment 属性
用法：counter-increment 属性设置某个选取器每次出现的计数器增量。默认增量是 1。
说明：利用这个属性，计数器可以递增（或递减）某个值，这可以是正值或负值。如果没有提供 number 值，则默认为 1。
注释：如果使用了display: none，则无法增加计数。如使用visibility: hidden，则可增加计数。
用法：counter-increment 属性设置某个选取器每次出现的计数器增量。默认增量是 1。
说明：利用这个属性，计数器可以递增（或递减）某个值，这可以是正值或负值。如果没有提供 number 值，则默认为 1。
注释：如果使用了display: none，则无法增加计数。如使用visibility: hidden，则可增加计数。
我们来看个例子加深理解：
<body> <h1></h1> <h2></h2> <h2></h2> <h1></h1> <h2></h2> </body>
body {
counter-reset:num_h1;
background:#aaa;
}
h1 {
counter-reset:num_h2;
background:#f0f;
}
h1:before {
content:"类别 " counter(num_h1) ;
counter-increment:num_h1;
}
h2:before {
counter-increment:num_h2;
content:counter(num_h1) "." counter(num_h2) ;
}
结果如下：
2.6 颜色值
颜色值的表示方法有以下几种：
em { color: #f00 } /* #rgb */
em { color: #ff0000 } /* #rrggbb */
em { color: rgb(255,0,0) }
em { color: rgb(100%, 0%, 0%) } CSS内置了一些颜色关键字，平时测试的时候可以用，做产品实际用的很少。