css的原理：
我們知道，css寫在不同的地方有不同的優先順序， .css檔案中的定義 < 元素style中的屬性，但是如果使用!important，事情就會變得不一樣。
首先，先看下面一段**：
測試css中的!important區別
.testclass
測試css中的important
雖然元素的style中有testclass類的定義，但是在上面的css定義中的用!important限定的定義卻是優先順序最高的，無論是在ie6-10或者firefox和chrome表現都是一致的，都顯示藍色。
這種情況也同時可以說明ie6是可以識別!important的，只是這個是ie6的乙個缺陷吧。如果寫成下面的樣式，ie6是識別不出來的：
.testclass
這樣，在ie6下展示的時候會顯示成紅色。
當然，也可以通過以下方式來讓ie6識別：
.testclass
.testclass
通過以上方式也是可以讓ie6顯示成藍色的。
以上例項說明使用!important的css定義是擁有最高的優先順序的。只是在ie6下出了一點小的bug，注意書寫方式一般可以輕鬆避開的。
css中margin和padding的使用
1 設定屬性方法 margin和padding都是用來隔開元素，margin用於布局元素使元素與元素互不相干，padding是用於元素與內容之間的間隔。元素四邊可以設定的屬性 margin top,margin right,margin bottom,margin left,padding top,...
舉例詳解CSS中position屬性的使用
position 這個屬性決定了元素將如何定位。它的值大概有以下五種 每個網頁都可以看成是由一層一層頁面堆疊起來的，如下圖所示。position 設定為 relative 的時候，元素依然在普通流中，位置是正常位置，你可以通過 left right 等移動元素。會影響其他元素的位置。而當乙個元素的 ...
詳解CSS中的Box Model盒屬性的使用
頁面上顯示的每個元素 包括內聯元素 都可以看作乙個盒子，即盒模型 box model 請看 chrome devtools 裡的截圖 可以顯而易見的看出盒模型由 4 部分組成。從內到外分別是 content padding border margin 按理來說乙個元素的寬度 高度以此類推 應該這樣計...