回覆列表
  • 1 # lanfengz2

    overflow:hidden這個CSS樣式是大家常用到的CSS樣式。一提到清除浮動,我們就會想到另外一個CSS樣式:clear:both。下面詳細的闡述一下“浮動”的含義。

    這是常用的div寫法,下面我們來書寫樣式。大家可以在DMX中自己做試驗

    #box{ :500px; background:#000; height:500px; }

    #content { float:left; width:600px; height:600px; background:red; }

    給box這個div加了一個overflow:hidden這個屬性解決了這個問題。我們直到overflow:hidden這個屬性的作用是隱藏溢位,給box加上這個屬性後,我們的content 的寬高自動的被隱藏掉了。

    說到這裡,我們再來理解一下“浮動”這個詞的含義。原先理解是在一個平面上的浮動,但是透過這個試驗會發現這不僅僅是一個平面上的浮動,而是一個立體的浮動。當content 這個div加上浮動這個屬性的時候,在顯示器的側面,它已經脫離了box這個div,也就是說,此時的content 的寬高是多少,對於已經脫離了的box來說都不起作用。

    當我們給box這個div加上overflow:hidden這個屬性時,其中的content 等等帶浮動屬性的div的在這個立體的浮動已經被清除了。這就是overflow:hidden清除浮動的準確含義。

    當我們沒有給box這個div設定高度的時候,content 這個div的高度,就會撐開box這個div。而在另一個方面,我們要注意到的是,當我們給box這個div加上一個高度值,那麼無論content 這個div的高度是多少,box這個高度都是我們設定的值。而當content 的高度超過box的高度的時候,超出的部分就會被隱藏。這就是隱藏溢位的含義。

  • 中秋節和大豐收的關聯?
  • 駕駛高空作業車有哪些管理制度?