实例:

  <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. git不能上传空目录和设备文件

    git不能上传空目录和设备文件:目录和设备文件不能完成校验. 使用命令校验: sha1sum  console

  2. libmysqlclient16 libmysqlclient-dev

    如果提示安装 libmysqlclient16 则用 libmysqlclient-dev 代替之

  3. JS实现复制到剪贴板(兼容FF/Chrome/Safari所有浏览器)

    现在浏览器种类也越来越多,诸如 IE.Firefox.Chrome.Safari等等,因此现在要实现一个js复制内容到剪贴板的小功能就不是一件那么容易的事了. 在FLASH 9 时代,有一个通杀所有浏 ...

  4. Linux 精确获取指定目录对应的块的剩余空间

    #include <stdio.h> #include <stdlib.h> #include <string.h> #include <sys/statfs ...

  5. NoSQL and Redis

    转自:http://www.cnblogs.com/fxjwind/archive/2011/12/10/2283344.html 首先谈谈为什么需要NoSQL? 这儿看到一篇blog说的不错http ...

  6. 【转】WCF入门教程三[WCF的宿主]

    一.WCF服务应用程序与WCF服务库 我们在平时开发的过程中常用的项目类型有“WCF 服务应用程序”和“WCF服务库”. WCF服务应用程序,是一个可以执行的程序,它有独立的进程,WCF服务类契约的定 ...

  7. fprintf宏

    最近在调试程序,使用printf函数和调试信息都不能在终端输出,所以使用比较笨的方法.将调试信息写到文件中,再查看文件.由于要多次使用fprintf函数,所以将其写成宏. 参考链接: http://w ...

  8. erlang 自定义函数的初步应用

    一.模块内调用 1> AA=fun(BB)-> io:format("this is test args ~s~n",[BB]) end.#Fun<erl_eva ...

  9. MVC中导航菜单,选中项的高亮问题。。

    先上图:             这个菜单是放在母板页的.比如当前选中的是异常业务监控.如果页面刷新了.就会变成第一张图..选择其他的选项也会,因为页面会刷新嘛.. 怎么处理这个问题了? 答案是记录当 ...

  10. optimization blocks (csapp chapter 5.1)

    p_511 编译器在没有指示下,会做‘ safe optimization',因此有些优化在没有参数的指示下是不会对代码做优化的,故在程序中应该避免某一类代码,因为它们妨碍了编译器做优化. optim ...