display:none和visibility:hidden都是把网页上某个元素隐藏起来的功能,但两者有所区别,经过亲自实验,我发现使用 visibility:hidden属性会使对象不可见,但该对象在网页所占的空间没有改变(看不见但摸得到),等于留出了一块空白区域,而 display:none属性会使这个对象彻底消失(看不见也摸不到)。
”这样的解释。
但是我觉得并不够,所以就想了一下关于他的一个加载问题。
有属性display:none;的结构在加载页面时,是否会同时加载呢?或则是当他变成display:block;的时候才加载的呢?
有属性visibility:hidden;   的结构在加载页面时,是否会同时加载呢?或则是当他变成visibility:visible;   的时候才加载的呢?

个人的看法是:
display:;当他的值变成block 的时候,它所在的结构才会被加载进来。
而visibility就会在加载页面的同时就已经把它加载进来了,因为他的值为hidden的时候,它所占的空间还在。

div的隐藏占用空间位置关系的更多相关文章

  1. div+css隐藏内容样式方法

    div css隐藏内容样式方法     div+css隐藏内容方法 一般情况下,css隐藏的用途,如下: 1.对文本的隐藏 2.隐藏超链接(另类黑链) 3.对统计代码隐藏 4.隐藏超出图片 5.css ...

  2. css div如何隐藏?

    在我们平时布局网站的时候,想要把div进行隐藏,但是很多人不知道css控制div显示隐藏?下面我们来讲解一下css如何让div隐藏. 1.使用display:none来隐藏div 我们可以使用disp ...

  3. JS魔法堂:判断节点位置关系

    一.前言 在polyfill querySelectorAll 和写弹出窗时都需要判断两个节点间的位置关系,通过jQuery我们可以轻松搞定,但原生JS呢?下面我将整理各种判断方法,以供日后查阅. 二 ...

  4. poj 1269 判断直线的位置关系

    题目链接 题意 判断两条直线的位置关系,重合/平行/相交(求交点). 直线以其上两点的形式给出(点坐标为整点). 思路 写出直线的一般式方程(用\(gcd\)化为最简), 计算\(\begin{vma ...

  5. 通过setSystemUiVisibility实现状态栏跟Activity之间的位置关系

    曾经说到去除状态栏和标题栏总会用到动态代码的方式实现: getWindow().setFlags(WindowManager.LayoutParams. FLAG_FULLSCREEN , Windo ...

  6. 平面内,线与线 两条线找交点 两条线段的位置关系(相交)判定与交点求解 C#

    个人亲自编写.测试,可以正常使用   道理看原文,这里不多说   网上找到的几篇基本都不能用的   C#代码 bool Equal(float f1, float f2) { return (Math ...

  7. 点击按钮对两个div的隐藏与显示进行切换

    HTML: <button type="button"  id="showHidden">点击切换div的隐藏与显示</button> ...

  8. POJ 2398 - Toy Storage 点与直线位置关系

    Toy Storage Time Limit: 1000MS   Memory Limit: 65536K Total Submissions: 5439   Accepted: 3234 Descr ...

  9. Intersecting Lines---poj1269(求两直线的位置关系)

    题目链接:http://poj.org/problem?id=1269 题意:给你两条直线上的任意不同的两点,然后求两条直线的位置关系,如果相交于一点输出该点坐标; #include<iostr ...

随机推荐

  1. 初学C#,用vs去开始hello world!

    小弟初学c#,刚刚学会用vs来编写经典的hello,world程序,记录,并且分享给大家. 1. 用vs新建一个c#控制台程序: a. 首先打开vs,如下图所示,点击[新建项目]

  2. git 常用口令

    版本管理 svn git   cd d 切换目录 cd www cd git git clone 一个地址 git status 获取修改的内容 git add * 上传修改的内容 git commi ...

  3. Vue项目 注释模板

    此内容只适用于vscode 1.打开项目->按快捷键->ctrl+shift+p 2.选择红线选中的内容 ,如果是中文版看如下图片 如果是英文版看如下图 3.就开始进行配置 大家根据这张图 ...

  4. 06. 用css实现三角形

    用css实现三角形   <!DOCTYPE html> <html lang="en"> <head> <meta charset=&qu ...

  5. $bzoj1019-SHOI2008$ 汉诺塔 $dp$

    题面描述 汉诺塔由三根柱子(分别用\(A\ B\ C\)表示)和\(n\)个大小互不相同的空心盘子组成.一开始\(n\)个盘子都摞在柱子\(A\)上,大的在下面,小的在上面,形成了一个塔状的锥形体. ...

  6. JS获取后台返回的JSON数据

    问题:通过$.get从后台获取了一段json串{"id":"1","name":"ww"},然后要拿到这里面的id和na ...

  7. SpringBoot内嵌Tomcat开启APR模式(运行环境为Centos7)

    网上查到的一些springboot内嵌的tomcat开启apr的文章,好像使用的springboot版本较老,在SpringBoot 2.0.4.RELEASE中已经行不通了.自己整理了一下,供参考. ...

  8. 用js实现匹配文本中的电话号、固定电话号

    思路: 1.用正则取出所有数字串 说起来容易,做起来难,开始只是简单的/D+/,后边发现这样做会将固定电话分成两段数字串,后经百度找到解决办法 /[^0-9/-]/ 意思是非数字不包括-作为分割 2. ...

  9. 网络安装Ubuntu16.04

    网络安装Ubuntu16.04 搭建PXE服务器 PXE是Pre-boot Execution Environment,预启动执行环境.是通过网络安装任何linux系统最重要的步骤. 首选搭建PXE服 ...

  10. Win中同时安装python2和python3及SulimeText3的python IDE搭建

    一.下载安装Sublime Text3,初衷是不想忍受pycharm的打开速度,想享受下飞的质感.Sublime Text3的安装已经久远,请自行google. 二.安装python2.7与pytho ...