当我们使用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. UDP通讯程序设计---6

    一.函数化 1.1服务器使用的函数 创建socket----->socket 绑定地址-------->bind 接受数据-------->recvfrom 发送数据-------- ...

  2. ubuntu14.04 and ros indigo install kinect driver--16

    摘要: 原创博客:转载请表明出处:http://www.cnblogs.com/zxouxuewei/ 今日多次测设ros indigo install kinect driver ,提示各种失败,然 ...

  3. JavaWeb学习记录(十九)——jsp标签库

    1.out标签 <%        //局部变量        String name="zsf>&<zz";        pageContext.se ...

  4. C# TcpClient TcpListener 简单练习01

    下面是读<Visual C#.Net 网络编程>整理的练习代码. 客户端发送命令给服务端,从服务器端获取所有人员的成绩或者指定人员的成绩. 命令格式为 GET 0|1 [Name].0为获 ...

  5. 为什么你应该试试用Sublog写博客

    HI 这篇文章发布后,收到了一些反馈,在不同的阅读媒体上(浏览器,RSS,evernote)等,会有样式兼容问题,特别是之前的代码显示行号的实现方式,使用浮动code块,兼容问题比较严重,所以做了一个 ...

  6. FileReader/FileWriter复制文件

    public class Test{ /*FileReader/FileWriter读写乱码,待处理*/ public static void main(String[] args) throws I ...

  7. Linux perf tools

    http://techblog.netflix.com/2015/08/netflix-at-velocity-2015-linux.html

  8. note: declarations in dependent base ‘std::basic_ios<char>’ are not found by unqualified lookup

    错误信息如题所示. 修改前: template< typename _CharT, typename _Traits = std::char_traits<_CharT> > ...

  9. Intel指令集专有词解释

    SSE 概述 SSE(Streaming SIMD Extensions)是英特尔在AMD的3D Now!发布一年之后,在其计算机芯片Pentium III中引入的指令集,是MMX的超集.AMD后来在 ...

  10. Spring MVC静态资源处理——<mvc:resources /> ||<mvc:default-servlet-handler /> 转载

    Spring MVC静态资源处理——<mvc:resources /> ||<mvc:default-servlet-handler /> mvcmvc:resources  ...