css隱藏div的方法：1、通過“display:none”實現(xiàn)隱藏div；2、通過“visibility:hidden”實現(xiàn)隱藏div；3、通過“opacity:0”實現(xiàn)隱藏div。

本文操作環(huán)境：windows7系統(tǒng)、HTML5&&CSS3版，DELL G3電腦

css怎么隱藏div？

三種CSS中隱藏Div的方法

CSS中display和visibility屬性可以隱藏和顯示html元素包括div層

一：

display:none|block display:none

隱藏該文件html，確切的說是在瀏覽器中清楚該元素，不占屏幕空間，若其下有其他元素就會移到該空間區(qū)域

display:block

顯示已經(jīng)隱藏的html元素

如果別的元素占有了該空間時，它將下移，

空間重新被原來的元素占用

二：

visibility:hidden|visible visibility:hidden

隱藏該元素，真正的隱藏，但他還占用那塊空間

visibility:visible

讓元素顯示

當一個元素的 visibility 屬性被設(shè)置成 collapse值后，對于一般的元素，它的表現(xiàn)跟hidden 是一樣的。

1.chrome 中，使用 collapse 值和使用 hidden 沒有區(qū)別。

2.firefox，opera 和 IE，使用 collapse 值和使用 display：none 沒有什么區(qū)別。

三：

opacity:0

opacity屬性我相信大家都知道表示元素的透明度，而將元素的透明度設(shè)置為 0 后，在我們用戶眼中，元素也是隱藏的，這算是一種隱藏元素的方法。 這種方法和 visibility:hidden 的一個共同點是元素隱藏后依舊占據(jù)著空間，但我們都知道，設(shè)置透明度為 0 后，元素只是隱身了，它依舊存在頁面中。

所以display和visibility控制的分別是html元素是否存在和是否顯示

display的屬性定義該元素存在或不存在

而visibility的屬性只是控制該元素是否顯示出來實際上還是存在的

opacity元素是隱藏的，但它它依舊存在頁面中

【推薦學(xué)習(xí)：css視頻教程】