
css隐藏div的方法:
1、display:none
css隐藏DIV及内容,完全隐藏内容与布局
解释:使用CSS单词display:none;完全隐藏文本及图片
使用div 中css样式display:none;将使得div内的内容隐藏通过浏览器什么也看不见,并且隐藏的内容也不会占用空间,通常用于JS特效隐藏、隐藏统计代码显示图标。
示例:
<html>
<head>
<title></title>
</head>
<style>
*{
margin:0;
padding:0;
}
.show{
height:100px;
width:100px;
display:none;
}
</style>
<body>
<div id="tab">
<h2>show</h2>
<div class="show"></div>
<h1>version</h1>
</div>
</body>
</html>效果图:

2.version:hidden
variable:hidden该div会被隐藏,但是依旧占样式空间,该div依然会影响布局
总结:display:none使div不存在,variable:hidden会保留div的宽高,占用一个空白区
示例:
<html>
<head>
<title></title>
</head>
<style>
*{
margin:0;
padding:0;
}
.show{
height:100px;
width:100px;
variable:hidden;
}
</style>
<body>
<div id="tab">
<h2>show</h2>
<div class="show"></div>
<h1>version</h1>
</div>
</body>
</html>效果图:

以上就是css如何隐藏一个div?的详细内容,更多请关注易知道|edz.cc其它相关文章!














