隐藏与显示:display/visibility/visible区别
说到标签的隐藏,你们会用到什么呢?display?visibility?还是服务器控件的visible?
显然,这三者都能起到隐藏与显示的效果,但是用途确完全不一样,请看用法与区别:
<div style="display:">显示</div>
<div style="display:none;">隐藏不占位</div> <div style="visibility:">显示</div>
<div style="visibility:hidden;">隐藏占位</div> <div visible="true" runat="server">显示</div>
<div visible="false" runat="server">消失不占位</div>
说明:
1)display
隐藏必须使用none值,该隐藏不占位,页面源代码可见。
显示可使用空或block或inline,意思分别为:无此属性、显示视为DIV(有换行符)、显示视为span(无换行符)。
2)visibility
隐藏必须使用hidden值,该隐藏占位,页面源代码可见。
显示可使用空或visible,意思分别为:无此属性、显示。
3)visible(服务器控件)
隐藏必须使用false值与runat="server",该隐藏不占位,页面源代码不可见。
显示可使用空或true,意思分别为:无此属性、可见。
隐藏与显示:display/visibility/visible区别的更多相关文章
- js基础--浏览器标签页隐藏或显示状态 visibility详解
欢迎访问我的个人博客:http://www.xiaolongwu.cn 前言 在工作中我们可能会遇到这样的需求,当浏览器切换到别的标签页或着最小化时,我们需要暂停页面上正在播放的视频或者音乐,这个需求 ...
- Display 和Visible 区别
一. web页面前台编码时经常用到display:none样式,平常使用时发现有几点特征需要注意 1.如果在样式文件或页面文件代码中直接用display:none对元素进行了隐藏,载入页面后, ...
- js display, visible 区别
注意: display:none和visible:hidden都能把网页上某个元素隐藏起来,在视觉效果上没有区别,但是在一些DOM操作中两者有区别: display:none ---不为被隐藏的对象保 ...
- 基础总结(04)-- display:none;&&visibility:hidden;区别
display:none 1.使元素隐藏,不再占据空间. 2.动态操作时会引起页面回流和重绘,影响性能. 3.子元素也会被隐藏并且添加display:block/visibility:visible无 ...
- display、visibility、visible区别
标签的隐藏可以有三种:display.visibility.服务器控件的visible. 显然,这三者都能起到隐藏与显示的效果,但是用途确完全不一样,请看用法与区别: <div style=&q ...
- CSS隐藏元素 display visibility opacity的区别
{ display: none; /* 不占据空间,无法点击 */ } { visibility: hidden; /* 占据空间,无法点击 */ } { position: absolute; ...
- 关于隐藏元素高度的问题 css visibility:hidden 与 display:none的区别
其实这是一个老问题了,s visibility:hidden 与 display:none 共同点就是都会似的元素不可见.但是 visibility:hidden 的DOM元素是占用空间的,会挤占其他 ...
- css中有三个显示和隐藏的单词比较常见,display visibility 和 overflow我们需要区分开来
display display 设置或检索对象是否及如何显示 display: none 隐藏对象与它相反的是display:block 除了转换为块级元素之外,同时还有显示元素的意思 特点: 隐藏之 ...
- HTML 显示/隐藏DIV的技巧(visibility与display的差别)
参考链接:http://blog.csdn.net/szwangdf/article/details/1548807 div的visibility可以控制div的显示和隐藏,但是隐藏后页面显示空白: ...
随机推荐
- 关于e820cycles参数
关于e820cycles参数http://bbs.wuyou.net/forum.php?mod=redirect&goto=findpost&ptid=327458&pid= ...
- 联想G480笔记本安装系统
联想G480笔记本安装系统 联想G480笔记本,配置i5双核四线程处理器,4G内存,500G硬盘,USB3.0接口,NVIDIA GeForce GT 610M+Intel HD Graphics 3 ...
- C/C++中堆与栈
本文介绍C/C++中堆,栈及静态数据区. 五大内存分区 在C++中,内存分成5个区,他们分别是堆.栈.自由存储区.全局/静态存储区和常量存储区.下面分别来介绍: 栈,就是那些由编译器在需要的时候分 ...
- 项目解析- JspLibrary - part2
banner.jsp 验证用户是否登录 <%String manager=(String)session.getAttribute("manager"); //验证用户是否登 ...
- table合并单元格colspan和rowspan .
colspan和rowspan这两个属性用于创建特殊的表格. colspan是“column span(跨列)”的缩写.colspan属性用在td标签中,用来指定单元格横向跨越的列数: 在浏览器中将显 ...
- unity3d模型制作规范
1. 单位,比例统一 在建模型前先设置好单位,在同一场景中会用到的模型的单位设置必须一样,模型与模型之间的比例要正确,和程序的导入单位一致,即便到程序需要缩放也可以统一调整缩放比例.统一单位为米. 2 ...
- eclipse ssh连接sqlserver express
public static String driver = "com.microsoft.sqlserver.jdbc.SQLServerDriver"; public stati ...
- java的HashMap与ConcurrentHashMap
好像今天没有什么源码读,那么就来看看java的这两种HashMap有啥不一样的地方吧,在这之前先普及一下HashMap的一些基本知识: (1)放入HashMap的元素是key-value对. (2)底 ...
- MyBatis实体类映射文件模板
<?xml version="1.0" encoding="UTF-8" ?> <!DOCTYPE mapper PUBLIC " ...
- Path Sum [LeetCode]
Problem Description: http://oj.leetcode.com/problems/path-sum/ Pretty easy. /** * Definition for bin ...