DIV CSS 佈局教程網

 DIV+CSS佈局教程網 >> 網頁腳本 >> JavaScript入門知識 >> JavaScript技巧 >> 實例詳解display:none與visible:hidden的區別
實例詳解display:none與visible:hidden的區別
編輯:JavaScript技巧     

display:none與visible:hidden的區別

display:none和visible:hidden都能把網頁上某個元素隱藏起來,但兩者有區別:

display:none ---不為被隱藏的對象保留其物理空間,即該對象在頁面上徹底消失,通俗來說就是看不見也摸不到。

visible:hidden--- 使對象在網頁上不可見,但該對象在網頁上所占的空間沒有改變,通俗來說就是看不見但摸得到。

例子:

<html>
<head>
<title>display:none和visible:hidden的區別</title>
</head>
<body >
<span style="display:none; background-color:Blue">隱藏區域</span><span style=" background-color:Green">顯示區域</span><br />
<span style="visibility:hidden; background-color:Blue">隱藏區域</span><span style="background-color:Green">顯示區域</span>
</body>
</html>

感謝閱讀,希望能幫助到大家,謝謝大家對本站的支持!

XML學習教程| jQuery入門知識| AJAX入門| Dreamweaver教程| Fireworks入門知識| SEO技巧| SEO優化集錦|
Copyright © DIV+CSS佈局教程網 All Rights Reserved