间隙产生的原因是`inline-block`对外是`inline`，对内是`block`。`inline`会将连续的空白符解析为一个空格（如：下面示例的两个`li`之间的后面的换行空格）。取消间隙的方法如下：

```html

Document

ul:last-child{
font-size: 0px;
}
li{
border: 1px solid #999;
padding: 2px;
min-width: 16px;
display: inline-block;
font-size: 14px;
line-height: 16px;
text-align: center;
}

有间隙

  • 首页
  • 上一页
  • 1
  • 2
  • 3
  • 下一页
  • 尾页

无间隙：删除空格

  • 首页
  • 上一页
  • 1
  • 2
  • 3
  • 下一页
  • 尾页

无间隙：父元素font-size: 0px;

  • 首页
  • 上一页
  • 1
  • 2
  • 3
  • 下一页
  • 尾页

```

CSS-inline-block 间隙的更多相关文章

  1. CSS 概念 Block Inline Containing block

    Block 元素 包括 "block-level box," "block container box," and "block box" ...

  2. DIV CSS display(block,inline,none)的属性教程

    display:inline.block.inline-block的区别 display:block就是将元素显示为块级元素. block元素的特点是: 总是在新行上开始: 高度,行高以及顶和底边距都 ...

  3. css display block 和 inline

    根据CSS规范的规定,每一个网页元素都有一个display属性,用于确定该元素的类型,每一个元素都有默认的display属性值,比如div元素,它的默认display属性值为“block”,成为“块级 ...

  4. css(二) block，inline和inline-block概念和区别

    转: http://www.cnblogs.com/KeithWang/p/3139517.html 总体概念 block和inline这两个概念是简略的说法,完整确切的说应该是 block-leve ...

  5. css - inline\inline-block\block

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  6. HTML/CSS：block，inline和inline-block概念和区别

    总体概念 block和inline这两个概念是简略的说法,完整确切的说应该是 block-level elements (块级元素) 和 inline elements (内联元素).block元素通 ...

  7. CSS中block，inline和block-inline的区别（转载）

    http://www.cnblogs.com/KeithWang/p/3139517.html 总体概念 block和inline这两个概念是简略的说法,完整确切的说应该是 block-level e ...

  8. CSS 去掉inline-block间隙的几种方法

    最近做移动端页面时,经常会用到inline-block元素来布局,但无可避免都会遇到一个问题,就是inline-block元素之间的间隙.这些间隙会导致一些布局上的问题,需要把间隙去掉.对于inlin ...

  9. 块状元素和内联元素 【inline block】

    // 9) { colorRandom += colorArray[randomV - 10]; } else { colorRandom += randomV; } } currentEle.css ...

  10. display:inline block inline-block 的区别

    原文地址:http://blog.csdn.net/jly036/article/details/5506182 display:block就是将元素显示为块级元素. block元素的特点是: 总是在 ...

随机推荐

  1. SQL标量函数

    调用 MS SQL 标量值函数,应该在函数前面加上 "dbo.",否则会报 “不是可以识别的 内置函数名称”错误.例如 DECLARE @WhichDB TINYINT;     ...

  2. python参数的介绍

    一.函数1.为什么要使用函数?减少代码的冗余2.函数先定义后使用(相当于变量一样先定义后使用)3.函数的分类:内置函数:python解释器自带的,直接拿来用就行了自定义函数:根据自己的需求自己定义的函 ...

  3. 线上服务器CPU100%排查

    某服务器上部署了若干tomcat实例,即若干垂直切分的Java站点服务,以及若干Java微服务,突然收到运维的CPU异常告警. 问:如何定位是哪个服务进程导致CPU过载,哪个线程导致CPU过载,哪段代 ...

  4. [LuoguP1829]Crash的文明表格(二次扫描与换根+第二类斯特林数)

    Solution: ​ 由于 \[ x^m = \sum_{i=0}^m{~m~\choose i}{~x~\brace i}i! \] ​ 将所求的式子化成这样,挖掘其性质,考虑是否能从儿子转移(或 ...

  5. [LOJ3123] CTSC2019重复

    Description 给定一个⻓为 n 的字符串 s , 问有多少个⻓为 m 的字符串 t 满足: 将 t 无限重复后,可以从中截出一个⻓度为 n 且字典序比 s 小的串. m ≤ 2000 n ≤ ...

  6. FZU 2187 回家种地 ( 扫描线 + 离散 求矩阵单次覆盖面积 )

    2187 回家种地 Accept: 56    Submit: 230Time Limit: 1000 mSec    Memory Limit : 32768 KB Problem Descript ...

  7. php中的花括号使用详解

    1.简单句法规则(用花括号界定变量名,适用于PHP所有版本,是php系统设定):    $a = 'flower';    echo "She received some $as" ...

  8. 2019-1-24-WPF-文字描边

    title author date CreateTime categories WPF 文字描边 lindexi 2019-01-24 19:47:18 +0800 2019-1-24 19:40:7 ...

  9. PyInstaller库的使用

    PyInstaller库的使用 PyInstaller库用于将已经写好的py程序,转换成可以跨平台的可执行文件 使用方式 发布主要借助cmd命令行来实现.在当前目录的powershell下,输入 py ...

  10. windows安装 阿里云的Fun工具

    由于项目使用到了 函数计算,特此了解到了需要安装 阿里云的Fun工具 Fun 是一个用于支持 Serverless 应用部署的工具,能帮助您便捷地管理函数计算.API 网关.日志服务等资源.它通过一个 ...