实例:

  <head>
        <style type="text/css">
            span{display: inline-block;height: 15px; line-height: 15px;}
            .span1{width: 3px;background-color: #ccc;}
            .span2{background-color: #ccc; font-size: 12px;}
            .span3{width: 2px; background-color: #ccc;}
        </style>
    </head>
    <body>
        <span>
            <span class="span1"></span>
            <span class="span2">aaaa</span>
            <span class="span3"></span>
        </span>
    </body>

当设置font-size之后,原本垂直居中的三个inline-block的元素,会变的不再垂直居中。

解决方案:

  1、span{display: inline-block;height: 15px; line-height: 15px; float:left;}

  2、.span1{width: 3px;background-color: #ccc; vertical-align: middle;}
            .span2{background-color: #ccc; font-size: 12px; vertical-align: middle;}
            .span3{width: 2px; background-color: #ccc; vertical-align: middle;}

疑问:

  font-size为什么会对排列展示产生影响?

font-size对展示的影响的更多相关文章

  1. unity UGUI text font size对性能影响较大

    Font Size对ugui text的性能影响非常大. <Cube Duck Run>在itouch5上测试是很流畅的,但是在iphone5上测试,在game over后显示历史最高分时 ...

  2. hiho #1288 微软2016.4校招笔试题 Font Size

    #1288 : Font Size 时间限制:10000ms 单点时限:1000ms 内存限制:256MB 描述 Steven loves reading book on his phone. The ...

  3. LaTeX :font size 修改字体大小的几种方式

    调整字体大小的几种方式,大小依次增大,具体如下: \tiny \scriptsize \footnotesize \small \normalsize \large \Large \LARGE \hu ...

  4. GetPropInfo Font Size

    设置font size,遍历所有控件,有的控件没有font属性,所以要用GetPropInfo判断 if (GetPropInfo(cmp, "font")) function G ...

  5. XE6 c++builder 设置 font size GetPropInfo SetOrdProp

    PPropInfo ppi; PTypeInfo pti; TTypeKinds ttk; TRttiContext context; TRttiType *rttiType TObject* obj ...

  6. UIAlertController custom font, size, color

    本文转载至 http://stackoverflow.com/questions/26460706/uialertcontroller-custom-font-size-color up vote2d ...

  7. Phone Font Size

    This table lists and describes the various font sizes that can be applied. Attribute = FontSize   Na ...

  8. PyCharm Change Font Size

    file->settings->colors&fonts-> save as (save the current scheme as your own)-> font- ...

  9. 【hihoCoder】1288 : Font Size

    题目:http://hihocoder.com/problemset/problem/1288 手机屏幕大小为 W(宽) * H(长),一篇文章有N段,每段有ai个字,要求使得该文章占用的页数不超过P ...

随机推荐

  1. spring 加载bean过程源码简易解剖(转载)

    这一篇主要是讲用载入bean的过程.其实就是IOC.低调 低调.. 我把重要的都挑出来了.一步步往下看就明白spring载入bean.xml里面bean的原理 . 感觉像候杰的 MFC深入浅出,哈哈. ...

  2. Logrotate日志轮巡missingok: 在日志轮循期间,任何错误将被忽略

    Linux日志文件总管——logrotate 编译自:http://xmodulo.com/2014/09/logrotate-manage-log-files-linux.html          ...

  3. ssh加密公私钥

    SSH公钥登录原理 在平时工作中我们经常要远程登录服务器,这就要用到SSH协议: $ ssh user@host 主要有两种登录方式:第一种为密码口令登录,第二种为公钥登录 密码口令登录 通过密码进行 ...

  4. Linq中的ToList()和CopyToDataTable()

    最近在项目中使用了Linq,想把Linq的查询结果直接转换成DataTable对象,通过查找发现Linq有一个CopyToDataTable<T>的泛型方法,该方法只能在T是DataRow ...

  5. jQuery源码分析-jQuery中的循环技巧

    作者:nuysoft/JS攻城师/高云 QQ:47214707 EMail:nuysoft@gmail.com 声明:本文为原创文章,如需转载,请注明来源并保留原文链接. 前记:本文收集了jQuery ...

  6. Eclipse使用技巧收集

    因为学习Java相关,对Eclipse这个开发工具用的不习惯,许多操作以及快捷键在百度得到解决后下次又忘记了.有时使用VS又混淆了它的快捷键操作.所以写个备忘录持续更新收集平时遇到的操作. 导入项目, ...

  7. ffmpeg笔记——UDP组播接收总结

    ffmpeg在avformat_open_input里面已经实现了UDP的协议,所以只需要设置好参数,将url传递进去就可以了. 和打开文件的方式基本一样: 01 AVCodecContext *pV ...

  8. C++字符串转化为数字的库函数

    原文链接:http://blog.csdn.net/tsinfeng/article/details/5844838 1.atoi 功 能:把一字符串转换为整数 用 法:int atoi(const ...

  9. Spring定时器Quartz的用法

    首先导入需要的两个jar: spring-context-support-4.1.1.RELEASE.jar quartz-2.2.1.jar 1.创建两个类: 2. QuartzConfigurat ...

  10. sip 认证分析

    转自:http://blog.csdn.net/wangqi0079/article/details/11569489 SIP类似Http协议.其认证模式也一样.Http协议(RFC 2616 )规定 ...