display:none与visible:hidden的区别

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

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

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

例子:

 

<html>
<head>
<title>display:none和visible:hidden的区别</title>
</head>
<body >
<span style="display:none; background-color:Blue">隐藏区域</span><span style=" background-color:Green">显示区域</span><br />
<span style="visibility:hidden; background-color:Blue">隐藏区域</span><span style="background-color:Green">显示区域</span>
</body>
</html>

 

时间: 2024-11-09 01:45:47

display:none与visible:hidden的区别的相关文章

css中display:none和visibility:hidden的区别

区别分析 首先我们都知道,display: none 和 visibility: hidden 都可以起到隐藏元素的功能 两者的区别在于占用文档流的不同 display: none 隐藏元素同时去除元素在文档流所占的空间 visibility: hidden 隐藏元素, 但不去除元素在文档流所占的空间 区别示例 HTML Code <span class="one">第一区域</span> <span>第二区域</span> <br

CSS学习教程:display:none和visibility:hidden

文章简介:display:none和visibility:hidden这两个属性对应的值都是隐藏对像,但是它们隐藏对像有点区别. display:none和visibility:hidden这两个属性对应的值都是隐藏对像,但是它们隐藏对像有点区别. display:none: 1.如果在样式文件或页面文件代码中直接用display:none对元素进行了隐藏,载入页面后,在没有通过js设置样式使元素显示的前提下,使用js代码会无法正确获得该元素的一些属性,比如offSetTop,offSetLef

Application、Session、Cookie、ViewState、Cache、Hidden的区别

方法信息量 大小作用域和保存时间应用范围保存位置Application任意大小整个应用程序的生命期整个应用程序/所有用户服务器端Cache任意大小可以根据需要设定整个应用程序/所有用户服务器端Session小量,简单的数据用户活动时间+一段延迟时间(一般为20分钟)单个用户服务器端Cookie小量,简单的数据可以根据需要设定单个用户客户端Viewstate小量,简单的数据一个Web页面的生命期单个用户客户端隐藏域小量,简单的数据一个Web页面的生命期单个用户客户端查询字符串小量,简单的数据直到下

一起谈.NET技术,Application、Session、Cookie、ViewState、Cache、Hidden的区别

方法 信息量大小 作用域和保存时间 应用范围 保存位置 Application 任意大小 整个应用程序的生命期 整个应用程序/所有用户 服务器端 Cache 任意大小 可以根据需要设定 整个应用程序/所有用户 服务器端 Session 小量,简单的数据 用户活动时间+一段延迟时间(一般为20分钟) 单个用户 服务器端 Cookie 小量,简单的数据 可以根据需要设定 单个用户 客户端 Viewstate 小量,简单的数据 一个Web页面的生命期 单个用户 客户端 隐藏域 小量,简单的数据 一个W

CSS里display的使用方法

 display:block是将对象块状化 display:none 是不显示 Qu1:我经常看到有做一个层,然后里面写点什么东西,然后就给它个属性display:none,这样这个东西就在网页上看不见了,但为什么还要建一个层呢,不是无谓的增加网页大小么? An:1.可以用js让它们显示 2.可以在层内做个iframe,当作后台,无刷新处理数据 3.在层里放一些图片,让浏览器先缓存,打开这些图片时会快一些 4.为了SEO,也就是搜索引擎优化,在隐藏的层里适当的做些"关键词" 等等...

jQuery的显示和隐藏方法与css隐藏的样式对比_jquery

display:none与visible:hidden的区别 display:none和visible:hidden都能把网页上某个元素隐藏起来,但两者有区别: display:none ---不为被隐藏的对象保留其物理空间,即该对象在页面上彻底消失,通俗来说就是看不见也摸不到. visible:hidden--- 使对象在网页上不可见,但该对象在网页上所占的空间没有改变,通俗来说就是看不见但摸得到. 例子: 复制代码 代码如下: <html> <head> <title&g

jQuery+jsp下拉框联动获取本地数据的方法(附源码)_jquery

本文实例讲述了jQuery+jsp下拉框联动获取本地数据的方法.分享给大家供大家参考,具体如下: JQuery下拉框联动很好的体现了Ajax的按需取数据的要求,减小数据的交互量.(点击此处下载源代码) 下面的实例使用Json将服务器端的类或者对象转换为JSON格式,主要运用了6个jar包 commons-beanutils-1.7.0.jar commons-collections-3.2.jar commons-lang-2.3.jar commons-logging-1.0.4.jar ez

前端知识体系全部

一些开放性题目 1.自我介绍:除了基本个人信息以外,面试官更想听的是你与众不同的地方和你的优势.  2.项目介绍  3.如何看待前端开发?  4.平时是如何学习前端开发的?  5.未来三到五年的规划是怎样的? position的值, relative和absolute分别是相对于谁进行定位的? absolute :生成绝对定位的元素, 相对于最近一级的 定位不是 static 的父元素来进行定位. fixed (老IE不支持)生成绝对定位的元素,通常相对于浏览器窗口或 frame 进行定位. r

12个你不可不知的css小技巧

1.去除input记住密码后自动填充表单的黄色背景 input:-webkit-autofill { -webkit-box-shadow:000px1000px#FFFinset;  } //其中#fff是背景颜色值 2.IE8不支持opacity:0属性,可以加上下面属性: filter: progid:DXImageTransform.Microsoft.Alpha(opacity=0); 3.IE input 框去掉文本框的叉叉和密码输入框的眼睛图标: ::-ms-clear,::-ms