是因为li标签换行导致的

简单的解决办法是将所有的li标签写到一行（不过实际上一般不会这样做）

或者把ul设置font-size为0，但这样ul中的文字就会消失，所以要记得单独给子元素设置font-size

safari中要给ul设置letter-spacing:0，给li设置letter-spacing:normal，道理和前面一样。

li元素之间产生间隔的更多相关文章

  1. 巧用android:divider属性设置LinearLayout中元素之间的间隔

    如上图,要想实现3个button线性排列并且使它们的大小相同.间隔相等.而且整体填充满整个linearlayout,我们一般的做法是在每两个button之间放一个固定宽度的view,然后设置butto ...

  2. 消除两个inline-block元素之间的间隔

    发现问题 两个inline-block元素之间的间隔.如下图 期望 消除两个inline-block元素之间的间隔. 解决方法 1.父元素字体大小设置为0 间隔的形成是非元素标签形成的 /** 方案1 ...

  3. 关于li标签之间的间隔如何消除！

    问题:li标签用了display:inline之后虽然成功的合并在一行,但是li标签之间出现了间距. 原因:按enter键换行之后li标签之间存在着空格,正是这些空格占据了li标签之间的空间. 解决方 ...

  4. 当li设置为line-block时，元素之间出现间隙的原因和解决方法

    原因 因为浏览器默认把inline元素之间的空白符(Tab.空格.换行)渲染成一个空格.而如下述代码,两个li元素之间的换行符被渲染成一个空格,则元素之间产生了间隙. 用Chrome浏览器将场景模拟出 ...

  5. 相邻元素之间的margin合并问题

    任何元素都可以设置border 设置宽高可能无效 行内元素设置padding,margin上下是无效的,左右是有效的 外边距合并:指的是,当两个垂直外边距相遇时,它们将形成一个外边距. 合并后的外边距 ...

  6. 关于inline-block 元素之间为何会产生间隔

    关于inline-block 元素之间为何会产生间隔 现象: <body> <input type="text"> <input type=" ...

  7. [Flex] PopUpButton系列 —— 设置弹出菜单与主按钮之间的间隔

    <?xml version="1.0" encoding="utf-8"?><!--设置弹出菜单与主按钮之间的间隔 PopUpButtonPo ...

  8. inline-block 元素之间的空白问题

    一.遇到的问题 前些天写瀑布流布局的时候,发现明明计算好了宽度使得一行能放下三张图片,实际效果却总是放不下,图片会挤到下一行去.上图: 可以看到,我本来是想要两行图片,每一行是三张.结果现在第一行的图 ...

  9. 两个inline-block中间有空白，解决inline-block 元素之间的空白问题

    目录 一.遇到的问题 二.举个简单的栗子分析问题 三.解决办法 一.遇到的问题 前些天写瀑布流布局的时候,发现明明计算好了宽度使得一行能放下三张图片,实际效果却总是放不下,图片会挤到下一行去.上图: ...

随机推荐

  1. jstat 命令

    NAME jstat - Monitors Java Virtual Machine (JVM) statistics. This command is experimental and unsupp ...

  2. struts框架之环境搭建(一)

    一.首先,我们需要做一些准备工作: 1.1.  下载struts:https://struts.apache.org/download.cgi#struts2520 1.2.  下载tomcat:ht ...

  3. idea快捷生成

    列模式: shift+alt+insert进入列选择模式,可选择一列或者多列 shift+alt+insert退出列选择模式 大小写转换: Ctrl + Shift + U 循环: iter  增强版 ...

  4. Cow and Snacks（吃点心--图论转换） Codeforces Round #584 - Dasha Code Championship - Elimination Round (rated, open for everyone, Div. 1 + Div. 2)

    题意:https://codeforc.es/contest/1209/problem/D 有n个点心,有k个人,每个人都有喜欢的两个点心,现在给他们排个队,一个一个吃,每个人只要有自己喜欢的点心就会 ...

  5. 图解django的生命周期

    其实django的生命周期的大体框架就是这样,剩下的细致的,自己再补充! 图片实在是有点抽象! 谅解!! koala-----给你更多技术小干货

  6. Lua的API函数

    1. 基础库 我们在整个教程中使用了各种主题下的基本库. 下表提供了相关页面的链接,并列出了本Lua教程各部分所涵盖的功能. 编号 库/方法 作用 1 错误处理 包括错误处理函数,如断言, 错误,如L ...

  7. NYOJ 石子合并（一） 区间dp入门级别

    描述    有N堆石子排成一排,每堆石子有一定的数量.现要将N堆石子并成为一堆.合并的过程只能每次将相邻的两堆石子堆成一堆,每次合并花费的代价为这两堆石子的和,经过N-1次合并后成为一堆.求出总的代价 ...

  8. IntelliJ IDEA 2017.3.2 热加载（Hot Swap）

    一.IntelliJ IDEA 自带热加载,修改代码后点击Ctrl + F9即可 缺点:1.Ctrl + F9只对当前类重新编译加载 2.只支持构造代码块的CRUD.方法体内代码修改.资源文件内容的修 ...

  9. 服务端相关知识学习（一）之什么是zookeeper

    什么是zookeeper zookeeper是分布式协调服务,可以在分布式系统中共享配置.协调锁资源.提供命名服务那分布式协调服务又是个什么东西呢?首先我们来看“协调”是什么意思.在一个并发的环境里, ...

  10. BZOJ5017题解SNOI2017炸弹--玄学递推

    题目链接 https://www.lydsy.com/JudgeOnline/problem.php?id=5017 分析 老师讲课谈到了这道题,课上想出了个连边建图然后乱搞的操作,被老师钦定的递推方 ...