css display:none和visibility:hidden和visible="false"区别

时间:2022-06-12 09:26:37

如果在div的style中把visibility设为hidden则div隐藏,但是它会占据空白空间,而如果设置成display:none则不占据空白空间;
而visible="false"则div不返回在html中;下面是给出的代码:运行一下就知道区别了。

<%

@ Page Language="C#" %>

 

 

<!

 

DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<

 

html xmlns="http://www.w3.org/1999/xhtml">

<

 

head runat="server">

 

 

 

 

<title>Untitled Page</title>

</

 

head>

<

 

body>

 

 

 

 

<form id="form1" runat="server">

 

 

 

 

<div>

 

 

 

aaa

 

</div>

 

 

 

 

<div style=" display:none;"><%--不占据空白空间--%>

aaa

 

</div>

 

 

 

 

<div>

 

 

 

aaa

 

</div>

 

 

 

 

<div>

 

 

 

aaa

 

</div>

 

 

 

 

<div style="visibility:hidden"><%--占据空白空间--%>

aaa

 

</div>

 

 

 

 

<div id="Div1" runat="server" visible="false">bbbbbbb</div>

 

 

 

 

<div>

 

 

 

aaa

 

</div>

 

 

 

 

<div id="Div2" runat="server" visible="false">bbbbbbb</div><%--在html中不存在--%>

 

</form>

</

 

body>

</

 

html>