css实现div显示隐藏的方法：1、使用CSS的display属性来隐藏或显示div；2、使用CSS的visibility属性来隐藏或显示div即可。
本文操作环境：windows7系统、HTML5&&CSS3版、Dell G3电脑。
CSS 实现div显示或隐藏的三种方法（display 和 visibility的区别）
1、使用CSS的 display 属性来隐藏或显示div：
display 属性规定元素应该 生成的框的类型，可以通过 display：none 来隐藏某一元素。
立即学习“前端免费学习笔记（深入）”；
style="display: none;"document.getElementById("typediv1").style.display="none";//隐藏document.getElementById("typediv1").style.display="";//显示
登录后复制
2、使用CSS的 visibility 属性来隐藏或显示div：
visibility 属性指定一个元素是否是可见的，可以通过 visibility：hidden 来隐藏某一元素。
style="visibility: none;"document.getElementById("div1").style.visibility="hidden";//隐藏document.getElementById("div1").style.visibility="visible";//显示
登录后复制
display 和 visibility 属性的区别：
display属性设置一个元素应该如何显示，而visibility属性指定一个元素应可见还是隐藏。
隐藏元素 -display:none 或 visibility:hidden
隐藏一个元素可以通过把display属性设置为none，或把visibility属性设置为hidden。但是请注意，这两种方法会产生不同的结果。
visibility:hidden：可以隐藏某一元素，但隐藏的元素仍需占用与未隐藏之前一样的空间，也就是说，该元素虽然被隐藏了，但仍然会影响布局。
h1.hidden {visibility:hidden;}
登录后复制
display:none：可以隐藏 某个元素，且隐藏的元素不会占用任何空间。也就是说，该元素不但被隐藏了，而且该元素原本占用的空间也会从页面布局中消失。
h1.hidden {display:none;}
登录后复制
所以display和visibility控制的分别是html元素是否存在和是否显示，dispay的属性定义该元素存在或不存在，而visibility属性只是控制该元素是否显示出来，实际上还是存在的。
【推荐学习：css视频教程】
使用JQuery的 show() 和 hide() 方法将一个div显示或隐藏：
show() 方法实现显示隐藏的被选元素：
注：show() 适用于通过 jQuery 方法 和 CSS中 display:none 隐藏的元素（你适用于通过 visibility:hidden 隐藏的元素）。
语法：$ (selector).show(speed,easing,callback) 具体参数详情 点这里
$("button").click(function(){ $("p").show();});
登录后复制
hide() 方法实现隐藏被选元素：
提示：这与CSS属性display:none 类似。
注释：隐藏的元素不会被完全显示（不影响页面的布局）。
语法：$ (selector).hide(speed,easing,callback) 具体参数详情 点这里
$("button").click(function(){ $("p").hide();});
登录后复制
以上就是div css怎么实现显示隐藏的详细内容，更多请关注【创想鸟】其它相关文章！
版权声明：本文内容由互联网用户自发贡献，该文观点仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容， 请发送邮件至253000106@qq.com举报，一经查实，本站将立刻删除。
发布者：PHP中文网，转转请注明出处：https://www.chuangxiangniao.com/p/2952900.html
