首頁  >  文章  >  web前端  >  css的一些小細節

css的一些小細節

高洛峰
高洛峰原創
2016-11-24 10:37:331572瀏覽

1、visibility隱藏元素不會導致reflow和repaint(回流與重繪)而display相反,同時visibility進行隱藏不會導致株連性(即子孫元素為visible時不會因為父級的hidden收到影響);

2、text-indent用負邊距進行文字隱藏時會產生額外效能耗損,而且它只能作用於block,table cells和inline-block屬性元素同時會產生虛線框,可用font:0/0 ' songti'替換;

3、用height:0;overflow:hidden進行組合隱藏元素的時候,當它子元素包含position:absolute或fixed時(父級元素無position屬性),會導致隱藏「失效」(即子元素不受剪切影響,註:當給父元素寬度也設定為0時,IE6、7會出現奇怪的「bug」隱藏子元素,之所以說bug因為親可以測試下這個時候打開IE調試工具選取隱藏父級子元素奇怪的出現了,至於問題知道親回復下);

4、position:absolute,沒有應用left/top等屬性值的元素就是個不佔據空間的普通元素,即此元素可以正常的繼承父級text-align等屬性(註:它繼承後對齊方式是以它自身的左邊為基線,例如定義text-align:right後它會以自身的最左邊靠齊父級的最右邊,有點繞口自己測試下會更明確例:

);


陳述:
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn