關於css中overflow hidden的使用

2022-09-17 12:54:18 字數 454 閱讀 7216

overflow:hidden有兩個用處經常用到:

1、通過設定自身的高度,加上overflow:hidden可以隱藏超過容器本身的內容;

但是,小編在以往的使用中,發現了乙個問題,只要父級容器設定了overflow:hidden,

那麼它的子孫元素都將會應用上去,並無法在內部消除,如果內部需要做div絕對定位position:absolute

溢位效果,則會被隱藏掉,so 在運用overflow:hidden時,請慎用。

2、清除浮動,一說這個,大家肯定想到的是clear:both;

但是,它們並不完全相同,overflow:hidden的清除浮動,是等於把居於它上空的人拉下來,關進自己盒子

的那個層次(z-index)以下的空間,不能出去,所以產生了乙個隱藏的效果,只有在盒子空間的那個缺口處,

(就是容器本身的寬高範圍內的可視介面)。

CSS 關於css中的border

曾經一直以為html中的border是直角的,直到有一天 test效果如下 突然有一種被欺騙了的感覺。我們可以選擇理解乙個border為兩個三角形再加乙個矩形。如上所示。繪製小尾巴 當對乙個角應用圓角樣式,如果這個角相鄰的兩個border乙個有定義而乙個無定義,那麼繪製的結果就是由粗到細的 小尾巴了...

關於css中的position

對於position的幾個屬性 static 無特殊定位,物件遵循html定位規則 absolute 將物件從文件流中拖出,使用left,right,top,bottom等屬性進行絕對定位。而其層疊通過z index屬性定義。此時物件不具有邊距,但仍有補白和邊框 relative 物件不可層疊,但將...

CSS中關於萬用字元樣式

一般來說我們為了方便設定margin和padding,為了把它置為0,我們都會去設定萬用字元 但是其實有的時候我們把所有的標籤都去這樣去設定是會出現問題的,也就是說可能會因為各個瀏覽器的解析方式不同,有時候不能完全達到初始化的效果,還有就是要給所有標籤都是設定也會對效能有所浪費,效率會低很多,因為萬...