当我们使用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. User_Agent_List 浏览器信息列表

    User_Agent_List = ['Mozilla/5.0 (Macintosh; U; Intel Mac OS X 10_6_8; en-us) AppleWebKit/534.50 (KHT ...

  2. JavaWeb学习记录(二十一)——国际化处理

    ¨国际化又称为 i18n:internationalization ¨对于软件中的菜单栏.导航条.错误提示信息,状态信息等这些固定不变的文本信息,可以把它们写在一个properties文件中,并根据不 ...

  3. 故障模块名称: mso.dll

    本人今天早上打开word文档的时候打不开了,反复试了n次也不成,一想八成儿要重新装了,结果我点开详细信息看了一下,看到了“故障模块名称: mso.dll”这个提示,结果我就放到了百度上找了一下,都是只 ...

  4. urllib,urllib2,requests对比

    #coding:utf-8 import urllib2 import urllib import httplib import socket import requests #实现以下几个方面内容: ...

  5. 图片Exif信息

    Exif文件格式简述链接:https://www.zhihu.com/question/23727439/answer/25467748 可交换图像文件常被简称为Exif(Exchangeable i ...

  6. easyUI之layout

    此组件与easyUI中的其它组件加载的方式相同,载为class方式和js方式,但此组件更多的是用class方式,其它的用js方式更为灵活.它继承panel组件及resize组件. 包括多个<di ...

  7. MyEclipse设置内存

    Tomcat直接启动正常,通过myeclipse启动tomcat内存溢出. MyEclipse启动Tomcat无视catalina.bat中设置内存大小的问题. 在 tomcat的catalina.b ...

  8. shell流程控制语句

    linux shell有一套自己的流程控制语句,其中包括条件语句(if),循环语句(for,while,until),选择语句(case/select).下面我将通过例子介绍下,各个语句使用方法. 1 ...

  9. ASP.NET GridView HyperLinkField传值和取值【转】

    来源:http://www.cnblogs.com/junjie94wan/archive/2011/08/17/2143623.html 经常做Winform程序,好久没有做WEB都有些生疏了,Gr ...

  10. Netflix Zuul 了解

    Zuul 是提供动态路由,监控,弹性,安全等的边缘服务.Zuul 相当于是设备和 Netflix 流应用的 Web 网站后端所有请求的前门.Zuul 可以适当的对多个 Amazon Auto Scal ...