使用display:inline-block产生间隙

一、产生的原因:当初设立标准的不是亚洲而是欧洲,inline元素为了正确显示英文字母如y j g等带有尾巴的,就在底下留空。
二、解决办法:

四个div之间有小间距,解决办法:让水平间隙消失就是在父级上加font-size:0;要设置字体大小可以在子元素里再设置。
让垂直间隙消失,就在子元素上加vertical-align:bottom。

如果子标签内有文字,则display:inline-block元素不会生成垂直方向有空白! 下面是解决好的效果:

使用display:inline-block产生间隙的更多相关文章

  1. display:inline block inline-block 的区别

    原文地址:http://blog.csdn.net/jly036/article/details/5506182 display:block就是将元素显示为块级元素. block元素的特点是: 总是在 ...

  2. display:inline、block、inline-block的区别

    display:block就是将元素显示为块级元素. block元素的特点是: 总是在新行上开始: 高度,行高以及顶和底边距都可控制: 宽度不设是它的容器的100%,除非设定一个宽度 <div& ...

  3. display:inline; display:block;

    block(块级元素): div .from. p .table. pre.h1~h6. dl .ol .ul等 inline(内联元素): span.a.strong.em.label.input. ...

  4. display:block、display:inline与displayinline:block的概念和区别

    总体概念 block和inline这两个概念是简略的说法,完整确切的说应该是 block-level elements (块级元素) 和 inline elements (内联元素).block元素通 ...

  5. display:inline 和display:inline-block和display:block的区别

    之前讲过块级元素使用display:block 行内元素使用display:inline 那么今天我们就来区分一下display:inline,display:inline-block和display ...

  6. 理解display:inline、block、inline-block

    要理解display:inline.block.inline-block的区别,需要先了解HTML中的块级(block)元素和行级(inline)元素的特点,行内元素也叫内联元素. 块级元素 总是另起 ...

  7. display:inline 跟 display:block 跟 display:inline-block区别

    我来说句人话吧.display:inline; 内联元素,简单来说就是在同一行显示.display:block; 块级元素,简单来说就是就是有换行,会换到第二行.display:inline-bloc ...

  8. HTML5 display:inline、block、inline-block的区别--备用

    display:block就是将元素显示为块级元素. block元素的特点是: 总是在新行上开始: 高度,行高以及顶和底边距都可控制: 宽度缺省是它的容器的100%,除非设定一个宽度 <div& ...

  9. display:inline、block、inline-block的区别(转)

    display:block就是将元素显示为块级元素. block元素的特点是: 总是在新行上开始: 高度,行高以及顶和底边距都可控制: 宽度缺省是它的容器的100%,除非设定一个宽度 <div& ...

  10. display:inline,display:inline-block,display:block 区别

    之前一直迷惑于display:inline/inline-block/block的异同,在度娘谷哥的帮助下,突然有了一点思路. 按照网上的介绍,inline将对象转化为内联元素,block将对象转化为 ...

随机推荐

  1. DotNetBar.Bar图标列表的使用

    DotNetBar.Bar图标列表的使用 老帅 控件DevComponents.DotNetBar.Bar怎样使用图像列表呢?比方给工具条或者菜单加上图标.例如以下几步就可以! 方法1: 1.放一个S ...

  2. Python-selenium 下拉框定位

    1.通过select 进行定位下拉框 首先selenium 很人性化的给提供了一个Select的模块,供处理下来菜单,首先我们需要导入Select,通过from selenium.webdriver. ...

  3. python连接mongo

    连接mongodb数据库 用到pymongo模块 应该是这样来使用: , 'goods') 然后连接数据库层这么写 def getSpinfo(item,value,depart,comp): res ...

  4. pycharm断点调试

    step over 执行下一步 蓝色高亮的那一行表示准备执行的代码

  5. 第六课 GDB调试 (上)

    1序言: 1.初学者经过学习前面的Makefile知识,信心满满,内心觉得应该要好好学习不单掌握语言的编写,也要学会相对应的工具调高开发效率.有时我们写出来的代码经过执行结果却跟我们预期不一样那怎么办 ...

  6. Kattis - fence2【二分法】

    Kattis - fence2[二分法] 题意 有一个农夫需要建造一个 N - 1 米长的篱笆,需要 N 根柱子,然后有 K 根 柱子 需要将这 K 根柱子 切成 N 段 然后 要尽量保证这 N 段柱 ...

  7. [MySQL] 实现树形的遍历(关于多级菜单栏以及多级上下部门的查询问题)

    前言:         关于多级别菜单栏或者权限系统中部门上下级的树形遍历,oracle中有connect by来实现,MySQL没有这样的便捷途径,所以MySQL遍历数据表是我们经常会遇到的头痛问题 ...

  8. $微信小程序开发实践点滴——接入Bmob后端云

    Bmob后端云官网:http://www.bmob.cn/ 微信公众平台官网:https://mp.weixin.qq.com/ 微信小程序官方开发文档:https://mp.weixin.qq.co ...

  9. 如何使用sql函数平均值、总数、最小值、最大值

    使用sql函数,您可以在一个select语句的查询当中,直接计算数据库资料的平均值.总数.最小值.最大值.总和.标准差.变异数等统计.使用recordset对象时,也可使用这些sql函数. sql函数 ...

  10. mysql中int(M) tinyint(M)中M的作用

    原先对mysql不太理解,但也没有报错.但理解的不够深入.这次补上. 原来以为int(11)是指11个字节,int(10)就是10个字节.我错了. http://zhidao.baidu.com/li ...