div设置display:inline-block属性产生空白间距

转载 2015年07月07日 11:17:46

     使用 inline-block 的时候,ie8、chrome、firefox、opera 以及 safari 浏览器下,两张图片之间有“空白间隙。

     平时写代码,为了使代码看上去“层级分明”,通常会在标签结束符后顺手打个回车,而回车会产生回车符,回车符相当于空白符,通常情况下,多个连续的空白符会合并成一个空白符,而产生“空白间隙”的真正原因就是空白符。

     去除空白符的存在只需要设置字体大小为零就行了(font-size:0;)

    

     参考资料:http://www.jb51.net/css/68785.html

display:inline-block空白间距的去除和兼容问题

网页布局中使用float的问题有很多,比如高度坍塌。 那么有没有一种可以替代float的方法呢? 我们首先想到的就是display:inline-block  inline-block不仅可以替代fl...

解决inline-block引起的空白间距问题

当我们在对元素的display属性使用inline-block值时,会在元素间形成一定宽度的空白间距。   下面看一下源代码: inline-block li{ display:inli...

如何解决inline-block元素的空白间距

有关于使用inline-block来代替float的讨论也蛮多的,最常说的就是使用inline-block来代替float进行布局,或者使用inline-block来实现元素的居中效果。前面《CSS3...

display:inline-block 间距问题

一 、左右间距问题.h-div{ width:100px; height: 50px; background: plum; border: 1px solid dark...

inline-block元素的空白间距解决方法

使用inline-block来代替float进行布局,或者使用inline-block来实现元素的居中效果。有关于使用inline-block来代替float的讨论也蛮多的。 不过就是使用inlin...
  • clh604
  • clh604
  • 2012年12月14日 16:02
  • 4148

去除display:inline-block元素间的间距

display:inline-block后元素间的间距 出现原因:换行或回车所致。 解决方法: 方法一:去除html中的空格    或    标签。       惆怅...

html使用display:inline-block实现标签右对齐,值左对齐效果。和设置div宽度,并居中显示。嵌套div的里层div文字居中显示

要实现下图所示的效果: 代码: $(document).ready(function(){ $("p").click(function(){ $(this).hide();...

DIV CSS display (block none inline)属性的用法

原文:http://www.cnblogs.com/Bill_Lee/archive/2011/04/11/2013110.html DIV CSS display (block n...
  • akiyame
  • akiyame
  • 2014年12月13日 22:41
  • 788

css中display:inline-block属性值的空隙消除

引用:http://www.duidea.com/2012/1129/1606_2.html 你真的了解 inline-block 了吗?本文将带你深入剖析该属性值的前世今生,让你更好的理解...

display:inline-block属性

在使用 CSS 实现表现的时候,会经常接触到 display:inline-block 这一属性,无论是初接触 Web 标准还是接触标准已久的朋友,大都会对这一属性感觉很迷惑和模糊。 display...
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:div设置display:inline-block属性产生空白间距
举报原因:
原因补充:

(最多只允许输入30个字)