<!DOCTYPE html>

<html lang="en">

<head>

  <meta charset="UTF-8">

  <meta name="viewport" content="width=device-width, initial-scale=1.0">

  <meta http-equiv="X-UA-Compatible" content="ie=edge">

  <title>Document</title>

  <style>

  div{

    background: black;

  }

  span{

    display: inline-block;

  }

  </style>

</head>

<body>

  <div>

    <span></span>

  </div>

</body>

</html>

可以看出div高度为20像素，明明span的高度为0，div的高度也应是0，为甚么会如图显示20像素。因为它存在每个“行框盒子”前面，同时具有该元素字体和行高属性的0宽度的内联盒

参考阅读：

《CSS世界》

css之幽灵空白节点的更多相关文章

  1. css消除空白节点的方法

    在做配置页面的时候,出现一个现在现象,两个同样的div(外框尺寸也是一样的),div里面包含有三个小的div ,三个小的div宽度也是一样的,同为33.3%,但是出现奇怪现象的就是左边一个有滚动条,右 ...

  2. js中移除空白节点

    //移除空白节点,空白节点的类型是3 function removeWhiteNode(node) {     for (var i = 0; i < node.childNodes.lengt ...

  3. JavaScript的DOM_处理空白节点

    一.空白节点产生的原因 在非 IE6,7,8 中,标准的 DOM 具有识别空白文本节点的功能.  在火狐浏览器等其他浏览器中是 7个,而 IE6,7,8 自动忽略了,如果要保持一致的子元素节点,需要手 ...

  4. 因浏览器而异的空白节点(js清除空白节点)

    先看下面的代码:<dl id="dll">  <dt>title</dt>  <dd>definition</dd>&l ...

  5. 为什么要点两下才能删除一个li节点 原来是空白节点作怪

    奇怪吧,下面的代码居然要点两次button才能删除一个li节点: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional// ...

  6. css禁止双击dom节点被选中user-select:none

    css禁止dom节点被选中:  当某个dom节点在快速重复点击的时候出现这个节点被选中,有时候其实并不希望出现这种情况,比如我们使用一个span或者a标签做为按钮dom元素的时候,快速双击这个按钮,就 ...

  7. 彻底搞懂CSS文本、空白换行问题

    首先,我们来整理一下与换行有关的3个CSS属性: word-break 该属性决定文本内容超出容器时,浏览器是否自动插入换行符. 属性值: normal:默认换行规则——英文以词为单位换行,连续字符不 ...

  8. 怎样通过CSS选择器获取元素节点或元素节点集合

    使用 document.querySelector() 和 document.querySelectorAll(), 将 CSS选择器 作为参数传入即可. // 标签选择器 document.quer ...

  9. [HTML/CSS]有一种节点叫做文本节点

    HTML可以看成是由节点(node)组成的树结构 我们一般都是在<p>节点里面写字符串. 在上图中,<p>节点和字符串之间有一个text, 这个text就是文本节点. 我们可以 ...

随机推荐

  1. Java的常量和变量

    一.标识符 如类名,数字不能作为标识符的首字母(以字母或者下划线或者$开头且不能有空格) 注意和Python的区别,Python中标识符由字母.下划线和数字组成,且数字不能开头,也是严格区分大小写(但 ...

  2. python爬取某站上海租房图片

    前言 对于一个net开发这爬虫真真的以前没有写过.这段时间开始学习python爬虫,今天周末无聊写了一段代码爬取上海租房图片,其实很简短就是利用爬虫的第三方库Requests与BeautifulSou ...

  3. Python——SQL——将查询的数据列表化

    sql = 'select paihao from yang1.cailiaopai' data = datebase.shujuku.sj_select(sql) #将获得的数据进行列表化 data ...

  4. Spring Boot 2.x 编写 RESTful API (一) RESTful API 介绍 & RestController

    用Spring Boot编写RESTful API 学习笔记 RESTful API 介绍 REST 是 Representational State Transfer 的缩写 所有的东西都是资源,所 ...

  5. 接口测试（jmeter和postman 接口使用）

    接口测试基础知识 接口测试主要用于检测外部系统与系统之间以及内部各个子系统之间的交互点.把前端(client)和后端(server)联系起来,测试的重点是要检查数据的交换,传递和控制管理过程,以及系统 ...

  6. Spring MVC 使用介绍（十六）数据验证 （三）分组、自定义、跨参数、其他

    一.概述 除了依赖注入.方法参数,Bean Validation 1.1定义的功能还包括: 1.分组验证 2.自定义验证规则 3.类级别验证 4.跨参数验证 5.组合多个验证注解 6.其他 二.分组验 ...

  7. model中的一些处理

    3.setting.py中设置 主要有三个地方需要设置: MEDIA_URL = ‘/media/’,设置该路径为了在模板中定位图片的位置,<img src="{{ MEDIA_URL ...

  8. bean属性复制到另外一个bean

    import org.springframework.beans.BeanUtils; BeanUtils.copyProperties(maker.getBaseInfo(), newBasInfo ...

  9. 【Spring】Spring随笔索引

    Spring随笔索引 [Spring]Spring bean的实例化 [Spring]手写Spring MVC [Spring]Spring Data JPA

  10. opencontrail—VXLAN模式下数据包的传输过程

    在这篇文章中,我们将看到VM生成的数据包如何能够到达另一个VM或外部资源,Neutron使用OpenContrail插件的上下文中的关键概念/组件是什么. 我们将重点介绍OpenContrail,它如 ...