1. 程式人生 > 其它 >css常遇問題

css常遇問題

#### 1、margin的粘連問題 【父子關係】
- 用padding替代
- 為父盒子新增overflow:hidden;
- 給父元素加邊框
#### 2、margin的塌陷問題【兄弟關係】
- 在一個元素身上設定足夠的間隔
#### 3、優先順序的判斷規則
- !important (無窮)> 行內樣式 (1000)> id(100) > class(10)> 標籤 (1)> *(0)
#### 4、單行文字溢位顯示省略號
1. 設定寬度 width: *px;
2. 強制不換行 white-space:nowrap;
3. 內容溢位隱藏 overflow:hidden;
4. 溢位的標識為省略號 text-overflow:ellipsis;
#### 5、清除浮動
- 給浮動元素的父親新增overflow:hidden;
- 給浮動元素的最後面新增一個空的div元素,設定clear:both;屬性
- 給浮動元素的父親子新增一個類名clearfix,設定樣式:
- .clearfix:after{
display: balock;
content:'';(內容為空)
clear:both; height: 0;
}
.clearfix { zoom:1 //相容IE6}
#### 6、偽元素和偽類
- 寫法上:偽類使用單冒號, 偽元素使用雙冒號。
- 概念上:偽類是一種臨時狀態,只有狀態被觸發的時候才會生效, :hover偽元素是一個假的元素,是一個虛擬的dom節點。