当我们使用inline-block 时,会出现空白间距问题。

但这些间距对我们的布局,或兼容性产生影响,我们需要去除它,该怎么办?下面简单介绍几种方法:

1.去掉html元素之间的空格,直接写在一行。

2.使用margin负值,通常可设置为margin:-4px

3.使用font-size:0。父元素设置为font-size:0,再把inline-block元素重新设置font-size;

4.使用float,不用inline-block。

[CSS]去除inline-block元素间距的几种方法的更多相关文章

  1. CSS3如何去除 inline block 元素之间多出的空格

    display: inline-block 属性很好的避免了元素的浮动问题,但是会有点小问题,就是 inline-block 元素间的回车会被显示为一个空格.然而,我们写代码时,都是用回车来格式化的. ...

  2. 去除inline-block元素间间距的N种方法-zhangxinxu

    张鑫旭原文:点这里进入原文 另外附上大漠老师的如何解决inline-block元素的空白间距地址!!! 去除inline-block元素间间距的N种方法: 一.现象描述 真正意义上的inline-bl ...

  3. CSS 去掉inline-block元素间隙的几种方法

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

  4. after及before伪元素及解决父元素塌陷的几种方法

    一.伪类和伪元素 CSS中伪类和伪元素有很多,也很好用!如果熟练使用的话可以解决很多问题 首先明白什么是伪类:伪类是基于当前元素的状态,而不是元素的id class等静态标志,它是动态变化的,它会在一 ...

  5. 关于iOS去除数组中重复数据的几种方法

    关于iOS去除数组中重复数据的几种方法   在工作工程中我们不必要会遇到,在数组中有重复数据的时候,如何去除重复的数据呢? 第一种:利用NSDictionary的AllKeys(AllValues)方 ...

  6. Knockout获取数组元素索引的2种方法,在MVC中实现

    原文:Knockout获取数组元素索引的2种方法,在MVC中实现 在遍历数组.集合的时候,通常要获取元素的索引,本篇体验使用Knockout获取索引的2种方法. 假设有这样的一个模型: namespa ...

  7. jquery阻止元素冒泡的两种方法

    通常情况下,如果给父元素添加事件之后,子元素也会继承同样的事件,这个时候就要阻止子元素的这种行为,成为阻止冒泡,总结两种解决方法: html代码: <div id="parent&qu ...

  8. JS去除数组中重复值的四种方法

    JS去除数组中重复值的四种方法 1 /// <summary>            o[this[i]] = "";  }      }       newArr.p ...

  9. 【亲测显式等待】Selenium:元素等待的4种方法

    Selenium:元素等待的4种方法 1.使用Thread.sleep(),这是最笨的方法,但有时候也能用到而且很实用.   2.隐式等待,隐性等待是指当要查找元素,而这个元素没有马上出现时,告诉We ...

随机推荐

  1. scala言语基础学习十一

    隐式转换 使用隐式转换加强现有的类型的功能-类似于设计模式的装饰模式

  2. 穿越泥地(mud) (BFS)

    问题 C: 穿越泥地(mud) 时间限制: 1 Sec  内存限制: 128 MB提交: 16  解决: 10[提交][状态][讨论版] 题目描述 清早6:00,FJ就离开了他的屋子,开始了他的例行工 ...

  3. HDU-4035 Maze (概率DP求期望)

    题目大意:在一个树形迷宫中,以房间为节点.有n间房间,每间房间存在陷阱的概率为ki,存在出口的概率为ei,如果这两种情况都不存在(概率为pi),那么只能做出选择走向下一个房间(包括可能会走向上一个房间 ...

  4. img元素底部有空白间距的问题

    <div style="width:100px;height:100px"><img src="./1.jpg"></div> ...

  5. vi基本操作

    vi的基本操作 a) 进入vi 在系统提示符号输入vi及文件名称后,就进入vi全屏幕编辑画面: $ vi myfile 不过有一点要特别注意,就是您进入vi之后,是处于「命令行模式(command m ...

  6. html5图片懒加载

    http://www.178.com/s/js/jquery.lazyload.min.js

  7. Optimize Managed Code For Multi-Core Machines

    Parallel Performance Optimize Managed Code For Multi-Core Machines Daan Leijen and Judd Hall This ar ...

  8. Linux中/proc/[pid]/status详细说明

    [root@localhost ~]# cat /proc/self/status Name: cat State: R (running) SleepAVG: 88% Tgid: 5783 Pid: ...

  9. 20 款超棒免费的 Bootstrap 管理和前端模板

    http://www.oschina.net/news/62506/20-best-free-bootstrap-admin-and-frontend-templates-2015

  10. webconfig中配置各种数据库的连接字符串

    mysql连接串: <add name="ConnectionString" connectionString="Server=localhost;Database ...