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>

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

发表于

我来说两句

0 条评论
登录 后参与评论

相关文章

来自专栏xingoo, 一个梦想做发明家的程序员

CListBox

CListBox 一:词条简介 CObject←CCmdTarget←CWnd←CListBox CListBox类提供Windows列表框的功能。列表框显...

1898
来自专栏Golang语言社区

【Go 语言社区】在golang里实现类似try catch 的异常处理机制

此文介绍的并非 使用panic/recover. 因为实际使用中不建议使用panic/recover. 但try catch finally 的编程方式 还是...

3796
来自专栏彭湖湾的编程世界

【Vue】详解Vue组件系统

Vue渲染的两大基础方式 new 一个Vue的实例 这个我们一般会使用在挂载根节点这一初始化操作上: new Vue({ el: '#app' }) 注册组...

30411
来自专栏柠檬先生

jquery 表单事件

.blur()    当元素失去焦点的时候触发事件。   .blur(handler(eventObject))     handler(even...

2059
来自专栏LIN_ZONE

Vue.js——60分钟快速入门(转载) Vue.js介绍声明该文是转载的,欢迎转载,支持尊重版权,原文作者:keepfool,原文地址:http://www.cnblogs.com/keepfo

Vue.js是当下很火的一个JavaScript MVVM库,它是以数据驱动和组件化的思想构建的。相比于Angular.js,Vue.js提供了更加简洁、更易于...

1252
来自专栏GreenLeaves

JavaScript之ClassName属性学习

     在前面的style属性学习中,知道了通过style属性可以控制元素的样式,从而实现了行为层通过DOM的style属性去干预变现层显示的目地,但是这种就...

2179
来自专栏简书专栏

基于bs4+requests爬取世界赛艇男运动员信息(进阶篇)

在详情页面,部分页面具有5个字段信息,部分页面具有2个字段信息。 每个字段信息都在li标签中,对每个li标签做循环遍历。 将li标签中的第1个class等于...

782
来自专栏coder修行路

css补充、JavaScript、Dom

css补充: position: fixed:可以将标签固定在页面的某个位置 absolute+relative:通过两者的结合可以让标签在一个相对的位置 代码...

1808
来自专栏老司机的简书

老司机读书笔记——Vue学习笔记

在默认情况下,v-model 在每次 input 事件触发后将输入框的值与数据进行同步 (除了上述输入法组合文字时)。你可以添加 lazy 修饰符,从而转变为使...

1683
来自专栏技术墨客

React学习(2)——状态、事件与动态渲染 原

    上一篇文章最后说明了组件传入的参数必须是只读的,但是在丰富的前端应用中,页面样式是时时刻刻会发生变化的。在前面的章节中介绍了一个时钟的例子,通过重复调用...

2201

扫码关注云+社区

领取腾讯云代金券