在css中， display:none和visibility:hidden都能够使元素隐藏。但是两者所带来的效果完全不同。

css  display:none

当使用该样式的时候，HTML元素的宽高等各种属性都将失效，其所占据的空间消失，可将该元素视作完全不存在。

css  visibility:hidden

当使用该样式的时候，HTML元素的宽高等各种属性不会失效，其所占据的空间也会被完全保留下来，可将该元素视作完全透明。

*当然当某HTML元素具有样式display: none;visibility: visible;的时候元素不显示。

*当某HTML元素是绝对定位的时候，可以通过将其left属性值设置为负值。

css元素隐藏（display:none和visibility:hidden）的更多相关文章

  1. CSS属性中display="none“与visibility="hidden"的不同

    display="none",元素会从页面移除,不在页面占用位置,当某个元素设置为display="none"时,这个元素后面的元素会移动上来 visibili ...

  2. CSS元素隐藏的display和visibility

    一.CSS元素隐藏 在CSS中,让元素隐藏(指屏幕范围内肉眼不可见)的方法很多,有的占据空间,有的不占据空间:有的可以响应点击,有的不能响应点击. { display: none; /* 不占据空间, ...

  3. CSS样式“display:none”与“visibility:hidden”区别

    CSS样式“display:none”和“visibility:hidden”都可以实现将页面元素隐藏,但是具体的效果是有差别的!下面通过两个小实验来说明这种差异. 实验代码: <!DOCTYP ...

  4. CSS样式display:none和visibility:hidden的区别

    同样是隐藏,display:none与visibility:hidden有什么区别呢? 虽然display:none与visibility:hidden都能达到隐藏可见元素的作用(视觉上),但事实上, ...

  5. CSS魔法堂：display:none与visibility:hidden的恩怨情仇

    前言  还记得面试时被问起"请说说display:none和visibility:hidden的区别"吗?是不是回答完display:none不占用原来的位置,而visibilit ...

  6. CSS display:none和visibility:hidden区别

    你知道CSSdisplay:none和visibility:hidden的区别吗,这里和大家分享一下,使用CSS display:none属性后,HTML元素(对象)的宽度.高度等各种属性值都将&qu ...

  7. 个人收集（转载）CSS中 display:none和visibility:hidden的区别

    visibility和display两个属性都有隐藏元素的功能,display:none和visibility:hidden的区别,简单的总结一句话就是:visibility:hidden隐藏,但在浏 ...

  8. display:none;与visibility:hidden;的区别

    visibility:隐藏对应的元素但不挤占该元素原来的空间.display:隐藏对应的元素并且挤占该元素原来的空间. 下面来看visibility和dispaly的一些参数 visibility用来 ...

  9. 您可能不知道的CSS元素隐藏“失效”以其妙用

    您可能不知道的CSS元素隐藏“失效”以其妙用 by zhangxinxu from http://www.zhangxinxu.com地址:http://www.zhangxinxu.com/word ...

随机推荐

  1. 我和小美的撸码日记(1)之软件也需靠脸吃饭，带您做张明星脸（附后台经典框架 DEMO 下载）

    众所周知程序员得靠技术吃饭,但是真的光靠技术就够了吗?Teacher苍,一位德艺双馨的艺术家,论技术她自然是炉火纯青,我觉得她桃李遍天下的原因不仅限于些,试想如果Teacher苍长得跟凤姐一样再带点乡 ...

  2. SpotMini末端控制策略

    相信很多人都注意到了“机器人学家”两天前推送的Boston Dynamics新机器人Spot-Mini.除了一如既往独领风骚的步态控制外,这次BD还给机器人增加了一个机械臂.视频中的一幕挺有趣,就是S ...

  3. mysql下怎样运行脚本

    假设要运行脚本: F:\hello world\niuzi.sql 第一种方法:        在命令行下(未连接数据库),输入 mysql -h localhost -u root  -p < ...

  4. OpenSSl 加密解密 示例（终于有编程实践了）

    OPenSSl的加密主要有三个重要的函数.看懂下面的代码就基本上知道该如何使用openssL来加密了. 不过注意,要先将libssl.so.1.0和libcrypto.so.1.0文件复制到执行的文件 ...

  5. Visual studio 使用正则表达查找替换

    原文 http://www.cnblogs.com/shineqiujuan/archive/2012/07/04/2575535.html 正则表达式是查找和替换文本模式的一种简洁而灵活的表示法.  ...

  6. uva1220--树的最大独立集+判重

    题意是挑选尽量多的人,并且每个人都不和他的父节点同时出现,很明显的最大独立集问题,难点在于如何判断方案是否唯一. 详情请见刘汝佳<算法竞赛入门经典--第二版>P282 #include&l ...

  7. 【HDU1102】Constructing Roads（MST基础题）

    最小生成树水题.prim一次AC #include <iostream> #include <cstring> #include <cstdlib> #includ ...

  8. BindService总结

    一.整体工程图 二.activity_bind.xml <?xml version="1.0" encoding="utf-8"?> <Lin ...

  9. [Immutable.js] Converting Immutable.js Structures to Javascript and other Immutable Types

    Immutable.js provides several conversion methods to migrate one structure to another. Each Immutable ...

  10. MFC读写配置文件

    void CFileTextDoc::OnIniread() { // TODO: Add your command handler code here CString strStudName;   ...