使用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. django--mysql设置

    mysql基本配置 'default': { 'ENGINE': 'django.db.backends.mysql', 'HOST': '127.0.0.1', 'PORT': 3306, 'USE ...

  2. python逆向工程:通过代码生成类图

    python逆向工程:通过代码生成类图 大致过程 现在有一个core包,里面有python的代码. 通过core包,生成python的类图,如下: 实施步骤: 1.首先安装graphviz,一个画图工 ...

  3. 枢轴点(Pivot Point)系统

    Pivot Point是日内交易方法,非常简单实用,是一套非常“单纯”的阻力支持体系,大概是10年前一个做期货的高手发明的方法,至今已经广泛的用在股票.期货.国债.指数等高成交量的商品上.经典的Piv ...

  4. 吴超老师课程--Hive的执行语句

    为什么选择Hive? (1)基于Hadoop的大数据的计算/扩展能力(2)支持SQL like查询语言(3)统一的元数据管理(4)简单编程 一:Hive的数据类型(1)基本数据类型tinyint/sm ...

  5. 本地连不上远程mysql数据库(1)

    Ubuntu 16.04下开启Mysql 3306端口远程访问   0. 前言 网上看到很多开启Mysql远程访问端口,修改的配置文件我都没有找到. 特意查看了我的Linux版本 $ sudo lsb ...

  6. PAT 天梯赛 L1-035. 情人节 【水】

    题目链接 https://www.patest.cn/contests/gplt/L1-035 AC代码 #include <iostream> #include <cstdio&g ...

  7. Spark机器学习5·回归模型(pyspark)

    分类模型的预测目标是:类别编号 回归模型的预测目标是:实数变量 回归模型种类 线性模型 最小二乘回归模型 应用L2正则化时--岭回归(ridge regression) 应用L1正则化时--LASSO ...

  8. What is CRC and how does it works?

    What is CRC and how does it works? CRC errors refer to Layer 1 or 2 issues. Two things you should ch ...

  9. yield、greenlet与协程gevent

    yield 在说明yield之前,我们了解python中一些概念. 在了解Python的数据结构时,容器(container).可迭代对象(iterable).迭代器(iterator).生成器(ge ...

  10. java:java静态代理与动态代理简单分析

    java静态代理与动态代理简单分析 转载自:http://www.cnblogs.com/V1haoge/p/5860749.html 1.动态代理(Dynamic Proxy) 代理分为静态代理和动 ...