div 显示与隐藏
visibility隐藏的对象还保留对象显示时所占的物理空间,display则不保留。可以保存下面的代码看看效果:
具体步骤:
代码示例:
<div style="border:1px solid #000;background:#eee">
< span style="width:200;height:200;visibility:hidden"></span>
←SS属性为visibility:hidden的对象
</div><br>
< div style="border:1px solid #000;background:#666">
< span style="width:200;height:200;display:none"></span>
←SS属性为display:none的对象
</div>
特别提示
用visibility属性控制隐藏的对象还占据着它显示时的位置,而display则没有。
特别说明
display属性设置元素的显示方式,对应脚本特性为display,可选值为none、block和inline,各值的说明如下:
none 隐藏元素,不保留元素显示时的空间。
block块方式显示元素。
inline 以内嵌方式显示元素。
inline-block对象显示为内嵌元素,但所有子对象都显示为块元素,相邻的内嵌元素将显示在同一行,允许空格。
list-item 将块元素显示为列表对象,并可以添加项目标点。(需要IE6.0+支持)
table-header-group 将元素作为表格标题组显示,相当于tHead元素。
table-footer-group 将元素作为表格脚注组显示,相当于tFoot元素。
visibility属性设置是否显示元素,对应的脚本特性为visibility,可选值为inherit、hidden和visible,各值的说明如下:
inherit 继承父元素的visibility属性设置。
hidden 隐藏元素,但保留其所占空间。
visible 显示元素(默认值)。
div 显示与隐藏的更多相关文章
- css控制div显示/隐藏方法及2种方法比较原码 - czf164的专栏 - 博客频道 - CSDN.NET
body{ font-family: "Microsoft YaHei UI","Microsoft YaHei",SimSun,"Segoe UI& ...
- jquery之超简单的div显示和隐藏特效demo
闲着无聊,看到某视频网站上讲的DIV显示和隐藏的效果,自己也写了一个. 觉得还是挺简单的. 前端改变世界!嘿嘿,还挺有成就感 <!DOCTYPE html PUBLIC "-//W3C ...
- div显示和隐藏
它是实现比较简单.style.display控制层隐藏或显示属性. <html> <body> <script> function show(){ document ...
- js控制div显示与隐藏
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- 根据class操作div显示与隐藏
<div class="otherComment" > <!-- style="display:none" --> 测试 </di ...
- setTimeout应用例子-移入移出div显示和隐藏
效果:移入div1,div2保持显示,移出div1,div2消失. 移入div2,div2保持显示,移出div2,div2消失. 一.HTML代码 <div id='div1'></ ...
- 通过select下拉框里的value控制div显示与隐藏
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...
- 在jsp页面嵌入java代码让某些div显示或者隐藏
<!--监测评价人显示评价人信息 --> <% if("D3".equals(role_flag)){%> <div id="crud&qu ...
- div显示与隐藏及height()函数
总结与网络 1. $("#id").show()表示display:block,$("#id").hide()表示display:none; $("# ...
随机推荐
- Swift之UIBezierPath
使用UIBezierPath可以创建基于矢量的路径.使用此类可以定义简单的形状,如椭圆.矩形或者有多个直线和曲线段组成的形状等.主要用到的该类的属性包括 moveToPoint: //设置起始点 ad ...
- Android 动画机制与使用技巧
动画效果一直是人机交互中非常重要的部分,与死板.突兀的显示效果不同,动画效果的加入,让交互变得更加友好,特别是在提示.引导类的场景中,合理地使用动画能让用户获得更加愉悦的使用体验 一.Android ...
- poj 3249 Test for Job (DAG最长路 记忆化搜索解决)
Test for Job Time Limit: 5000MS Memory Limit: 65536K Total Submissions: 8990 Accepted: 2004 Desc ...
- Sleep v.s. sleep
Sleep函数_百度百科 http://baike.baidu.com/link?url=EmOxsG_du8HdLbv_9nDVlahpZOQ6DgkoLKooQInorAqIl_CEhCvBzTC ...
- C/C++的参数传递机制
近来公司招人较多,由此面试了非常多的C++程序员.面试时,我都会问到参数传递的相关问题,尤其侧重指针.因为指针毕竟是C/C++最重要的一个优势(在某种情况下也可以说是劣势).但其结果是,1/3的人基本 ...
- Doing Homework 状态压缩DP
Doing Homework 题目抽象:给出n个task的name,deadline,need. 每个任务的罚时penalty=finish-deadline; task不可以同时做.问按怎样的 ...
- 数据结构【二】:简单阻塞队列BlockingQueue
在POSIX多线程[一]:简单队列simple queue的基础上使用内部互斥锁和条件变量来控制并发以达到线程安全的目的,其主要用于 [生产者-消费者] 队列. 1.BlockingQueue初始化时 ...
- JS实现滚动条滚到页面距离底部300px时执行事件的方法
scrollTop为滚动条在Y轴上的滚动距离. clientHeight为内容可视区域的高度. scrollHeight为内容可视区域的高度加上溢出(滚动)的距离 $(window).scroll(f ...
- chrom浏览器避免弹出“确定要离开此面吗?”提示框
一.避免弹出提示框 在网上搜了很多,答案大都是设置window.onbeforeunload=null ,但是试用之后无效. 这个问题放了两天之后返回来再次想,终于找到了答案,在此和大家分享一下: 解 ...
- 证明Dijkstra中加入S的点已经最优
语言抽象,仅供自用. 证明一个即将加入S集合的点u必然D[u]=最小值min: 假设D[u] != 最小值,那么即说明存在一条最短路径,该路径可以描述为:S集合中的一个点(至少为起始点) + 一个 ...