display:none显示和隐藏
<html>
<head>
<title>显示和隐藏问题</title>
<meta charset="utf-8"/>
<style type="text/css">
#a{
width: 500px;
height: 300px;
background-color: red;
/*display:none;*/
visibility:hidden;
}
#b{
width: 100px;
height: 200px;
background-color: green;
display:block;
/*display:none;*/
visibility: hidden;
}
#c{
width: 100px;
height: 200px;
background-color: blue;
}
</style>
</head>
<body>
<div id="a">a
<div id="b">b</div>
<div id="c">c</div>
</div>
</body>
</html>
display:none;和visibility: hidden;都可以隐藏元素。区别是display:none彻底不显示元素,元素不占空间,跟完全没有一样。visibility: hidden只是把元素隐藏不显示,但还是占有原来的位置空间的。
另:如果父div设置为隐藏属性,则其孩子也都被隐藏。(然后想单独设置孩子显示,也显示不出来,目前测试是这样)
display:none显示和隐藏的更多相关文章
- jquery控制css的display属性(显示与隐藏)
jquery控制div的显示与隐藏,很方便的. 例如: $("#id").show()表示display:block, $("#id").hide()表示dis ...
- jquery控制css的display(控制元素的显示与隐藏)
使用jquery控制div的显示与隐藏: $("#div的id").show()表示display:block, $("#div的id").hide()表示di ...
- 控制HTML元素的显示与隐藏——display和visibility
有些时候我们需要根据某些条件来控制Web页面中的HTML元素显示还是隐藏,可以通过display或visibility来实现.通过下面的例子了解display和visibility的区别,简单的例子代 ...
- css3-10 如何控制元素的显示和隐藏(display和visibility的区别是什么)
css3-10 如何控制元素的显示和隐藏(display和visibility的区别是什么) 一.总结 一句话总结:使用的时候直接在元素的样式中设置display和visibility属性即可.推荐使 ...
- 显示和隐藏(display属性)
网页中经常会看到显示和隐藏的效果,可通过display属性来设置. 语法: Object.style.display = value 注意:Object是获取的元素对象,如通过document.get ...
- 显示和隐藏(display属性)none或block
显示和隐藏(display属性) 网页中经常会看到显示和隐藏的效果,可通过display属性来设置. 语法: Object.style.display = value 注意:Object是获取的元素对 ...
- 使用 jQuery 选择器获取页面元素,然后利用 jQuery 对象的 css() 方法设置其 display 样式属性,从而实现显示和隐藏效果。
查看本章节 查看作业目录 需求说明: 使用 jQuery 选择器获取页面元素,然后利用 jQuery 对象的 css() 方法设置其 display 样式属性,从而实现显示和隐藏效果. 具体要求如下: ...
- js 与JQuery显示及隐藏方法
虽然以后两种方式都能让文本信息隐藏和显示 第一种文本隐藏以后还是会占居位置, 第二种则不会占位置. <p id="p1">这是一段文本.</p> <i ...
- jQuery判断当前元素显示状态并控制元素的显示与隐藏
1.jQuery判断一个元素当前状态是显示还是隐藏 $("#id").is(':visible'); //true为显示,false为隐藏 $("#id") ...
随机推荐
- Linux crontab定时器的使用
crontab参数: -u:帮助其他用户建立或移除工作排程 -l:查阅crontab的工作内容 -r:移除所有的crontab的工作内容 -e:编辑crontab文件 每项工作有六个字段: * * * ...
- Django模板的继承
一.extend 1.extend继承模板 2.一个文件中只能继承一个模板 3.extend继承模板中的所有内容,模板的内容包括:html的head和body ,eg:
- JS二分查找
二分法查找,也称折半查找,是一种在有序数组中查找特定元素的搜索算法.查找过程可以分为以下步骤:(1)首先,从有序数组的中间的元素开始搜索,如果该元素正好是目标元素(即要查找的元素),则搜索过程结束,否 ...
- 【转】Xen与XenServer的区别
说到XenServer,总是离不开Xen,所以我要说他们的区别,得首先从Xen开始说起! Xen体系架构 Xen hypervisor体系架构 Xen 的 VMM ( Xen Hypervisor ) ...
- Dynamic Programming [Algorithm]
今天学习动态规划01背包问题,从一篇非常不错的文章中学习甚多.转载于此,感谢作者的分享! 原文地址 通过金矿模型介绍动态规划 对于动态规划,每个刚接触的人都需要一段时间来理解,特别是第一次接触的时候总 ...
- Java Web中的中文编码
Java Web开发中经常会遇到中文编码问题,那么为什么需要编码呢?因为人类需要表示的符号太多,无法用1个字节来表示,而计算机中存储信息最小单元为1个字节.所以必须指定char与byte之间的编码规则 ...
- ongl(原始类型和包装类型)
原始类型和包装类型 //首先创建两个实体类 user 和 address user中包含address package cn.jbit.bean; public class User { //用户类 ...
- sql语句返回值的问题
由于执行sql语句的时候执行成功或者失败会返回执行的影响函数,用list是因为查询的结果可能为null也可能set后放到集合里去: 所以返回值类型用int
- cf Round 633
A.Rebus(思维题) 给出一个这种形式的表达式 ? + ? - ? + ? = n.要求用1-n的数字填充疑问号使等式成立,如果不存在这样的方式,则输出不可能.存在则输出任意的方式. 移项可以变成 ...
- [LeetCode] Decode Ways 解码方法
A message containing letters from A-Z is being encoded to numbers using the following mapping: 'A' - ...