display:none和visible:hidden都能把网页上某个元素隐藏起来,但两者有区别:

display:none ---不为被隐藏的对象保留其物理空间,即该对象在页面上彻底消失,通俗来说就是看不见也摸不到。

visible:hidden--- 使对象在网页上不可见,但该对象在网页上所占的空间没有改变,通俗来说就是看不见但摸得到。

例子:

<html>
<head>
<title>display:none和visible:hidden的区别</title>
</head>
<body >
<span style="display:none;"> 你好!</span><span style=" background-color:Green">你好!</span><br />
<span style="visibility:hidden;"> 你好!</span><span style="background-color:Green">你好!</span>
</body>
</html>

visible:hidden和dispaly:none的区别的更多相关文章

  1. display:none与visible:hidden的区别 slideDown与

    display:none与visible:hidden的区别 display:none和visible:hidden都能把网页上某个元素隐藏起来,但两者有区别: display:none ---不为被 ...

  2. display:none与visible:hidden的区别

    display:none和visible:hidden都能把网页上某个元素隐藏起来,但两者有区别: display:none ---不为被隐藏的对象保留其物理空间,即该对象在页面上彻底消失,通俗来说就 ...

  3. Readonly和disabled的区别 display:none和visible:hidden的区别

    怎样使input中的内容为只读,也就是说不让用户更改里面的内容. <input type="text" name="input1" value=" ...

  4. display:none与visible:hidden区别

    if(list.style.display=='none'){                 list.style.display='block';             }else{       ...

  5. display:none和visible:hidden两者的区别

    display:none和visible:hidden都能把网页上某个元素隐藏起来,但两者有区别:display:none ---不为被隐藏的对象保留其物理空间,即该对象在页面上彻底消失,通俗来说就是 ...

  6. 【javascript】jq之display:none与visible:hidden

    今天学习到jquery的hide()部分时,突然有一个想法,jquery中的隐藏/显示部分的实现是给目标元素附加一个"display: none"属性,那么如果在类似于下面的布局中 ...

  7. jq之display:none与visible:hidden

    http://www.cnblogs.com/linxiong945/p/4075146.html 今天学习到jquery的hide()部分时,突然有一个想法,jquery中的隐藏/显示部分的实现是给 ...

  8. display:none;visibility:hidden;opacity:0;之间的区别

    什么是回流 当render tree中的一部分(或全部)因为元素的规模尺寸,布局,隐藏等改变而需要重新构建.这就称为回流(reflow).每个页面至少需要一次回流,就是在页面第一次加载的时候,这时候是 ...

  9. style="visibility: hidden" 和 style=“display:none”区别

    大多数人很容易将CSS属性display和visibility混淆,它们看似没有什么不同,其实它们的差别却是很大的. visibility属性用来确定元素是显示还是隐藏的,这用visibility=& ...

随机推荐

  1. Mac部署hadoop3(伪分布式)

    环境信息 操作系统:macOS Mojave 10.14.6 JDK:1.8.0_211 (安装位置:/Library/Java/JavaVirtualMachines/jdk1.8.0_211.jd ...

  2. Flash安全总结

    ActionScript AS是基于ECMAScript的语言,为了交互的需要flash应用引入ActionScript.ActionScript一共有三个版本,其中3.0较之前两个版本变化很大.Ac ...

  3. [JZOJ5178]【NOIP2017提高组模拟6.28】So many prefix?

    Description

  4. 扩展阿里p3c实现自定义代码规范检查

     前段时间fastjson报出了漏洞,只要打开setAutoType特性就会存在风险,自己测试环境的一个项目被揪出来了-_-!.虽然改动很小,但就是觉得憋屈.fastjson还是挺好的,想着禁用的话太 ...

  5. robotframework+ride+python3环境搭建

    一.windows下安装python3.6 1.官网下载安装包https://www.python.org/downloads/windows/ 2.进行安装,接下来步骤一直next即可 二.cmd下 ...

  6. 03 python学习笔记-文件操作(三)

    本文内容主要包括以下方面: 1. 文件操作基本认识2. 只读(r, rb)3. 只写(w, wb)4. 追加(a, ab)5. r+读写6. w+写读7. a+写读(追加写读)8. 文件的修改 一.文 ...

  7. C++沉思录笔记 —— 序幕

    #include <stdio.h>   class Trace{public: void print(const char* s) { printf("%s\n", ...

  8. Java IO_003.Reader与Writer--字符流以及编码对数据的操作(读取与写入)

    Java IO之Reader与Writer对象常用操作(包含了编码问题的处理) 涉及到文件(非文件夹)内容的操作,如果是纯文本的情况下,除了要用到File(见之前文章),另外就必须用到字符输入流或字符 ...

  9. linux sqlite安装

    wget http://www.sqlite.org/sqlite-3.6.16.tar.gz tar -zxvf sqlite-3.6.16.tar.gz  cd sqlite-3.6.16 ./c ...

  10. postman的基本用法,请求,断言,环境变量

    postman基本用法 Postman是一款功能强大的网页调试与发送网页HTTP请求的Chrome插件. 它提供功能强大的 Web API & HTTP 请求调试. 它能够发送任何类型的HTT ...