说到标签的隐藏,你们会用到什么呢?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区别的更多相关文章

  1. js基础--浏览器标签页隐藏或显示状态 visibility详解

    欢迎访问我的个人博客:http://www.xiaolongwu.cn 前言 在工作中我们可能会遇到这样的需求,当浏览器切换到别的标签页或着最小化时,我们需要暂停页面上正在播放的视频或者音乐,这个需求 ...

  2. Display 和Visible 区别

    一.   web页面前台编码时经常用到display:none样式,平常使用时发现有几点特征需要注意   1.如果在样式文件或页面文件代码中直接用display:none对元素进行了隐藏,载入页面后, ...

  3. js display, visible 区别

    注意: display:none和visible:hidden都能把网页上某个元素隐藏起来,在视觉效果上没有区别,但是在一些DOM操作中两者有区别: display:none ---不为被隐藏的对象保 ...

  4. 基础总结(04)-- display:none;&&visibility:hidden;区别

    display:none 1.使元素隐藏,不再占据空间. 2.动态操作时会引起页面回流和重绘,影响性能. 3.子元素也会被隐藏并且添加display:block/visibility:visible无 ...

  5. display、visibility、visible区别

    标签的隐藏可以有三种:display.visibility.服务器控件的visible. 显然,这三者都能起到隐藏与显示的效果,但是用途确完全不一样,请看用法与区别: <div style=&q ...

  6. CSS隐藏元素 display visibility opacity的区别

    { display: none; /* 不占据空间,无法点击 */ }  { visibility: hidden; /* 占据空间,无法点击 */ }  { position: absolute; ...

  7. 关于隐藏元素高度的问题 css visibility:hidden 与 display:none的区别

    其实这是一个老问题了,s visibility:hidden 与 display:none 共同点就是都会似的元素不可见.但是 visibility:hidden 的DOM元素是占用空间的,会挤占其他 ...

  8. css中有三个显示和隐藏的单词比较常见,display visibility 和 overflow我们需要区分开来

    display display 设置或检索对象是否及如何显示 display: none 隐藏对象与它相反的是display:block 除了转换为块级元素之外,同时还有显示元素的意思 特点: 隐藏之 ...

  9. HTML 显示/隐藏DIV的技巧(visibility与display的差别)

    参考链接:http://blog.csdn.net/szwangdf/article/details/1548807 div的visibility可以控制div的显示和隐藏,但是隐藏后页面显示空白: ...

随机推荐

  1. SAP MM移动平均价和标准价逻辑

    从收货到领用,S一直都是以标准价格计算,V是实时更新 S 时将差异结转到在产品,产品中,最后结转到生产成本,最终到利润.具有计划性,可以控制考核 V 是实时更新,出现差异直接对应材料中调整.价格可以直 ...

  2. 国内重要的MySQL传播平台

    何登成 博客地址 http://hedengcheng.com/ 微博地址 @何_登成 评价:文笔细腻+理论知识丰富+实战Oracle+实战MySQL 吴炳锡 http://wubx.net/ hat ...

  3. 【bzoj1053】反素数

    [bzoj1053]反素数 题意 对于任何正整数x,其约数的个数记作g(x).例如g(1)=1.g(6)=4.如果某个正整数x满足:g(x)>g(i) 0<i<x,则称x为反质数.例 ...

  4. div 自适应高度 自动填充剩余高度

    方案1: Html: <div class="outer"> <div class="A"> 头部DIV </div> &l ...

  5. nodeschool.io 4

    ~~ MY FIRST ASYNC I/O! ~~ Write a program that uses a single asynchronous filesystem operationto rea ...

  6. $('#checkbox').attr('checked'); 返回的是checked或者是undefined解决办法

    $('#checkbox').attr('checked'); 返回的是checked或者是undefined解决办法 <input type='checkbox' id='cb'/>  ...

  7. 你不知道的JavaScript-- 事件流与事件处理

    转载:http://blog.csdn.net/i10630226/article/details/48970971 1. 事件处理 1.1. 绑定事件方式 (1)行内绑定 语法: //最常用的使用方 ...

  8. js字符串处理

    1.获取字符串实际长度 var jmz = {}; function strlen(str) { ///<summary>获得字符串实际长度,中文2,英文1</summary> ...

  9. spring配置带参数的视图解析器:ParameterMethodNameResolver

    1.配置处理器 <!-- 处理器 --> <bean id="myController" class="cn.cnsdhzzl.controller.M ...

  10. js在前端获取在本地上传图片的尺寸

    var MyTest = document.getElementById("upload_img").files[0];var reader = new FileReader(); ...