CSS控制DIV層顯示和隱藏的實現方法

css中的display和visibility屬性

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

display:none|block;

display:none;

隱藏該html元素，確切的說，是在瀏覽器中消除該元素，不佔螢幕的空間。若其下有其他元素，就會上移到該空間區域（好像桌子上有100塊錢，現在我把它放在抽屜裡藏起來，桌子上放100錢的地方可以放在其他任何東西）。

dispaly:block;

顯示已經隱藏的html元素，如果別的元素占有了該空間時，他將下移，空間重新別原來的元素占有。（把100塊錢重新從抽屜裡那出來放回桌子上）。

visibility：hidden|visible;

visibility:hidden;

隱藏該元素，正真的隱藏，但他還占有那塊空間。這時，（桌子上有100塊錢，這是我蓋了桌布把他隱藏起來，錢還在那裡）。

visibility:visible;

讓元素顯示（拿掉了桌布，看到了100塊錢）。

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

接下來用**來舉個例子，**：

css code

複製內容到剪貼簿

"testd"

style=

"border:#ddd 1px solid"

>   

"display:block;border:#ccc 2px solid"

>   

"visibility:visible;border:#aaa 2px solid"

>   

display   

"testv"

style=

"border:#ddd 1px solid"

>   

"display:block;border:#ccc 2px solid"

>   

"visibility:visible;border:#aaa 2px solid"

>   

visibility   

"button"

value=

"testdisplay"

οnclick=

"testdisplay()"

/>   

"button"

value=

"testvisibility"

οnclick=

"testvisibility()"

/>   

CSS和JS控制DIV層顯示和隱藏的實現方法

css中display和visibility可以隱藏和顯示html元素包括div層。看起來兩者非常類似，很多人會搞混。下面分別介紹兩者的屬性 display none block 1.display none 隱藏該html元素，在瀏覽器中消除該元素，不佔螢幕的空間。若其下有其他元素，就會上移到該空...

css控制div顯示 隱藏方法

css中隱藏和顯示html元素 可以用display和visibility，屬性如下 1.display none block display none 隱藏該html元素，在瀏覽器中消除該元素，不佔螢幕的空間。dispaly block 顯示已經隱藏的html元素，如果該空間被別的元素占有了，他將...

js控制按鈕,div顯示和隱藏

點我一下 方法 一 mymodal show 顯示 mymodal hide 隱藏 方法二 mymodal css display none 隱藏 mymodal css display block 顯示 演示方法 mymodal click function 如果出現排版問題,刪除block my...