间隙产生的原因是`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. DbWrench002--建模以及数据正向工程和反向工程的具体操作

    DbWrench--建模以及数据正向工程和反向工程 参考博客:https://my.oschina.net/u/3459265/blog/1611999 一.数据正向工程 在建模工作中画好的表与表之间 ...

  2. Python判断端口连通性

    #!/usr/bin/env python # -*- coding: utf-8 -*- import socket,sys def MySQL_Connet(MySQL_ip): MySQL_so ...

  3. vuex基本使用

    1.组件之间共享数据的方式 父向子传值:v-bind 属性绑定 子向父传值:v-on 事件绑定 兄弟组件之间共享数据:EventBus $on 接收数据的那个组件 $emit 发送数据的那个组件 2. ...

  4. [暑假集训Day1T2]北极通讯网络

    这题主要考察对“卫星电话”的理解,k个卫星电话相当于可以让k个联通块保持联通,因此我们只需要让原图连成k个联通块,然后给每个联通块的任意一个节点发一部卫星电话即可.因此我们需要连n-k条边,特别地,当 ...

  5. 分布式ID增强篇--优化时钟回拨问题

    原生实现 本文承接sharding-jdbc源码之分布式ID,在这篇文章中详细介绍了sharding-jdbc的分布式ID是如何实现的:很遗憾的是sharding-jdbc只是基于snowflake算 ...

  6. 【学习总结】Python-3-转义字符

    参考: 本教程的评论区:菜鸟教程-Python3-Python数字 转义字符: 在需要在字符中使用特殊字符时,python用反斜杠()转义字符 END

  7. ApacheHttpServer修改httpd.conf配置文件

    转自:https://blog.csdn.net/dream1120757048/article/details/77427351 1. 安装完 Apache HTTP Server 之后,还需要修改 ...

  8. XMPP即时通讯协议使用（六）——开发Openfire聊天记录插件

    转载地址:http://www.cnblogs.com/hoojo/archive/2013/03/29/openfire_plugin_chatlogs_plugin_.html 开发环境: Sys ...

  9. C语言获取当前时间

    #include <stdio.h> #include <time.h> void main () { time_t rawtime; struct tm * timeinfo ...

  10. 【LeetCode】双指针 two_pointers（共47题）

    [3]Longest Substring Without Repeating Characters [11]Container With Most Water [15]3Sum (2019年2月26日 ...