今天沒事看下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系統上有）