CSS中的display和visibility屬性

css中display和visibility可以隱藏和顯示html元素包括DIV層。看起來(lái)兩者非常類(lèi)似，很多人會(huì)搞混。下面分別介紹兩者的屬性：

display:none|block;

display:none;

隱藏該html元素，確切的說(shuō)，是在瀏覽器中消除該元素，不占屏幕的空間。若其下有其他元素，就會(huì)上移到該空間區(qū)域（好像桌子上有100塊錢(qián)，現(xiàn)在我把它放在抽屜里藏起來(lái)，桌子上放100錢(qián)的地方可以放在其他任何東西）。

dispaly:block;

顯示已經(jīng)隱藏的html元素，如果別的元素占有了該空間時(shí)，他將下移，空間重新別原來(lái)的元素占有。（把100塊錢(qián)重新從抽屜里那出來(lái)放回桌子上）。

visibility：hidden|visible;

visibility:hidden;

隱藏該元素，正真的隱藏，但他還占有那塊空間。這時(shí)，（桌子上有100塊錢(qián)，這是我蓋了桌布把他隱藏起來(lái)，錢(qián)還在那里）。

visibility:visible;

讓元素顯示（拿掉了桌布，看到了100塊錢(qián)）。

所以display和visibility控制的分別是html元素是否存在和是否顯示，display的屬性定義該元素存在或不存在，而visibility的屬性只是控制該元素是否顯示出來(lái)，實(shí)際上還是存在的。

有興趣的可以按照下方代碼實(shí)際操作下，代碼：