差异:

1。占用的空间不同。

可见性占用域空间,而显示不占用。

可见性和显示可以隐藏页面,例如:

将元素显示属性设置为block将在该元素后换行。

将元素显示属性设置为inline将消除元素换行。

将element display属性设置为none可隐藏元素内容而不占用域空间。

将“元素可见性”属性设置为“隐藏”,以隐藏元素内容,但占用域中的空间。

将“元素可见性”属性设置为“可见”,以显示元素内容。

2。对正常文档流的不同响应。

如果要隐藏某个元素,但在页面上为该元素留有空间,则应使用visibility:hidden。如果要在用空白填充其他内容时隐藏元素,则应使用display:none。

实际上,我发现人们更倾向于使用显示属性(我相信这也是大多数人的习惯)。当你决定隐藏一个显示元素:没有,你必须知道其他内容会填充那个元素留下的空白,从而改变页面的布局。

扩展数据

有时我们通过隐藏关键字来欺骗SEO,但不是使用可见性:隐藏和显示:无,我们应该设置关键字的颜色与背景色相同,或者关键字的大小非常小,这样访问者就找不到它们。

有些人担心可见性的使用:隐藏和显示:没有,因为他们害怕蜘蛛的排斥。实际上,通过元素可见性的转换,可以获得许多漂亮的效果。

搜索引擎也理解这种方法(事实上,搜索引擎往往忽略CSS),所以如果你的目标不是欺骗搜索引擎,你可以安全地使用可见性:隐藏和显示:无隐藏内容。

javascript中 visibility和display区别在哪的更多相关文章

  1. javascript中 visibility和display的区别

    visibility属性用来确定元素是显示还是隐藏的,这用visibility="visible|hidden"来表示(visible表示显示,hidden表示隐藏). 当visi ...

  2. 坑:JavaScript 中 操作符“==” 和“===” 的区别

    标题:JavaScript 中 操作符"==" 和"===" 的区别 记录一些很坑的区别: 1. '' == '0' // false 0 == '' // t ...

  3. js中 visibility和display的区别 js中 visibility和display的区别

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

  4. visibility,display区别

    visibility:hidden,display:none 前者隐藏位置还在,后者隐藏位置消失

  5. javaScript中"=="和"==="运算符的区别

    相同点: 两个运算符均可用于比较两个值是否相等,可允许操作任意类型的操作数,如果操作数相等则返回true,否则返回false. 不同点: "==="运算符也称为严格相等运算符,它用 ...

  6. Javascript中valueOf与toString区别

    前言 基本上,所有JS数据类型都拥有这两个方法,null除外.它们俩解决JavaScript值运算与显示的问题,重写会加大它们调用的优化. 测试分析 先看一例:var aaa = {  i: 10,  ...

  7. javascript中in和hasOwnProperty区别

    in操作符只要通过对象能访问到属性就返回true.hasOwnProperty()只在属性存在于实例中时才返回true. function Person(){ } Person.prototype.n ...

  8. javascript 中 undefined 和 null 区别

    1.相同点 如果我们直接用 undefined == null  比较他们是相等的返回的将是 true. 2.区别 当我们用undefined === null 比较的时候最后返回的将是 false. ...

  9. javascript中apply,call,bind区别,bind兼容等问题总结

    1 三者的相似之处: (1).都是用来改变函数的this对象的指向的 (2).都是用第一个参数来做this对象的指向 (3).都可以传参数进去 那么,具体到它们有什么区别呢?请看下面的例子: 两个对象 ...

随机推荐

  1. Thinkphp5 的sesssion在同一个控制器不同的方法无法获取session的原因和对策

    这一段在用thinkPHP5开发微信小程序接口的时候,在同一个控制器一个方法中存入session,在另一个方法中取出session,一直都是无法取出. 查阅各种资料得到原因:thinkPHP5里面的s ...

  2. 问题解决:fatal error C1083: 无法打开包括文件:No such file or directory

    fatal error C1083: 无法打开包括文件:No such file or directory将别的工程直接用VS2010打开出现了该问题,此时必须检查是不是: 1. 如果要引入的这些.h ...

  3. 深度学习之GAN对抗神经网络

    1.结构图 2.知识点 生成器(G):将噪音数据生成一个想要的数据 判别器(D):将生成器的结果进行判别, 3.代码及案例 # coding: utf-8 # ## 对抗生成网络案例 ## # # # ...

  4. JAVA 基础编程练习题14 【程序 14 求日期】

    14 [程序 14 求日期] 题目:输入某年某月某日,判断这一天是这一年的第几天? 程序分析:以 3 月 5 日为例,应该先把前两个月的加起来,然后再加上 5 天即本年的第几天,特殊情况, 闰年且输入 ...

  5. bash-1 初始化CentOS系统的初始化脚本

    初始化CentOS系统的初始化脚本 #!/bin/bash # #******************************************************************* ...

  6. JAVA实验报告及第八周总结

    JAVA第八周作业 实验报告六 实验一 编写一个类,在其main()方法中创建一个一维数组,在try字句中访问数组元素,使其产生ArrayIndexOutOfBoundsException异常.在ca ...

  7. PAT 甲级真题题解(121-155)

    1121 Damn Single 模拟 // 1121 Damn Single #include <map> #include <vector> #include <cs ...

  8. VIM 介绍

    gedit  a.txt  是一个图形界面的文本编辑器.  需要安装图形界面才会有. nano a.txt  也是一样的 vi  是一种文本界面的编辑器. vim  是 vimsual interfa ...

  9. 【LOJ】#3086. 「GXOI / GZOI2019」逼死强迫症

    LOJ#3086. 「GXOI / GZOI2019」逼死强迫症 这个就是设状态为\(S,j\)表示轮廓线为\(S\),然后用的1×1个数为j 列出矩阵转移 这样会算重两个边相邻的,只要算出斐波那契数 ...

  10. FileSystemResource 找不到文件

    环境 Spring 3.2.5.RELEASE 原因 使用 FileSystemResource 加载文件的过程中,发现一个奇怪的现象,路径完全正确,但是找不到文件的情况.可能的原因是文件的路径上有压 ...