今天没事看下css的东西，发现了一个小问题，
问题虽小，但是当你找不到原因的时候真是让人郁闷半天。
下面有个例子：
定义one.css文件 ：
one.css:
/****************
* fileName:one.css
****************/
p{
color:red;
}
定义two.css文件：
two.css:
/****************
* fileName:two.css
****************/
p{
background:yellow;
}
定义test.css文件：
test.css:
/****************
* fileName:test.css
****************/
p{
border:2px solid blue;
}
@import url("two.css");
@import url("one.css");
定义css.html文件
/****************
* fileName:css.html
****************/
<html>
<head>
<title>css</title>
<link rel="stylesheet" type="text/css" href="css/test.css" />
</head>
<body>
<p>aaa</p>
<p style="text-align:center">bbb</p>
<p>ccc</p>
</body>
</html>
从上面的代码中可以看出来，test.css引用了one.css和two.css两个文件。
上面的代码看上去没什么问题？！
我在IE中打开css.html的时候所有定义的css样式都可以显示出来，
但是当我在chrome浏览器中打开css.html的时候发现，只有test.css中的p段落定义的样式有效果，
而通过@import引入进来的css文件都没有效果。
通过网上查资料才发现，原来是css引入的时候，必须放到css文件的开头，
也就是说test.css的文件必须如下定义：
正确的test.css定义:
/****************
* fileName:test.css
****************/
@import url("two.css");
@import url("one.css");
p{
border:2px solid blue;
}
在chrome浏览器上试了一下，所有的样式定义都出来啦，
感觉cctv，终于出来了
总结：
1.IE对css和html的支持都使不严格的，
2.chrome对css和html的定义比较IE来说更加遵循W3C的定义。
3.要想执行跨浏览器的网页，必须严格遵循W3C的定义，同时兼顾一下IE6~IE9（IE10暂时用的人非常少，只会在window8系统上有）