方法1:

  父元素设置height=line-height,子元素设置vertical-align:middle;

方法2:

  父元素display:table-cell;vertical-align:middle;

如何垂直居中<img>?的更多相关文章

  1. CSS垂直居中的11种实现方式

    今天是邓呆呆球衣退役的日子,在这个颇具纪念意义的日子里我写下自己的第一篇博客,还望前辈们多多提携,多多指教! 接下来,就进入正文,来说说关于垂直居中的事.(以下这11种垂直居中的实现方式均为笔者在日常 ...

  2. css元素水平居中和垂直居中的方式

    关于居中的问题,一直处于疑惑不解的状态,知道的几种方法好像也不是每一次都会起到作用,所以更加迷惑.主要是不清楚该 在什么情况下采用哪种解决方法,所以,整理了一些方法,梳理一下思路,做一个总结. 1. ...

  3. [css]实现垂直居中水平居中的几种方式

    转自博客 http://blog.csdn.net/freshlover/article/details/11579669 居中方式: 一.容器内(Within Container) 内容块的父容器设 ...

  4. css样式让input垂直居中

    css样式让input垂直居中 css代码: .div1{ border: 1px solid #CCC; width:1120px; height:40px; margin:auto; displa ...

  5. CSS垂直居中总结

    工作中遇到垂直居中问题,特此总结了一下几种方式与大家分享.本文讨论的垂直居中仅支持IE8+ 1.使用绝对定位垂直居中 <div class="container"> & ...

  6. CSS实现水平|垂直居中漫谈

    利用CSS进行元素的水平居中,比较简单,手到擒来:行级元素设置其父元素的text-align center,块级元素设置其本身的left 和 right margins为auto即可.而撸起垂直居中, ...

  7. CSS3与页面布局学习总结(三)——BFC、定位、浮动、7种垂直居中方法

    一.BFC与IFC 1.1.BFC与IFC概要 BFC(Block Formatting Context)即“块级格式化上下文”, IFC(Inline Formatting Context)即行内格 ...

  8. CSS教程:div垂直居中的N种方法以及多行文本垂直居中的方法

    在说到这个问题的时候,也许有人会问CSS中不是有vertical-align属性来设置垂直居中的吗?即使是某些浏览器不支持我只需做少许的CSS Hack技术就可以啊!所以在这里我还要啰嗦两句,CSS中 ...

  9. IE6+未知尺寸元素水平垂直居中

    首先讨论在IE8以上(也就是支持伪元素after的基础上)的2种情况 当有一段不知道长度大小的文字在你面前,你需要使它垂直居中的时候,你肯定会想到:1.text-align:center;水平居中没错 ...

  10. html文本垂直居中对齐

    html文本垂直居中对齐,代码如下: <div id="box" style="height:100px; line-height:100px; border:1p ...

随机推荐

  1. JS的组成部分、引入页面的方法以及命名规范

    JS的组成部分.引入页面的方法以及命名规范   一.页面是由三部分组成 1)html标签(超文本标记语言) 2)css样式(层叠样式表) 3)javascript脚本编程语言(动态脚本语言) 二.将c ...

  2. phpcms v9文章页调用点击量方法

    1.在页面加载" 2.调用统计点击的标签:: 3.最后,在写上这一句:" phpcms v9增加文章随机点击数的方法 找到文件count.php(网站根目录/api) 查找第50行 ...

  3. Java经典案例之-判断兔子的数量(斐波那契数列)

    /** * 描述:有一对兔子,从出生后第3个月起每个月都生一对兔子,小兔子长到第四个月后每个月又生一对兔子, * 假如兔子都不死,问每个兔子总数为多少? * 分析:根据题目条件可以推断 * 兔子的规律 ...

  4. oracle11g手工建库

    1.设置环境变量 [oracle@HE3~]$ vi .bash_profile exportPATH exportEDITOR=vi exportORACLE_SID=orcl exportORAC ...

  5. HDU1172(枚举)

    猜数字 Time Limit: 20000/10000 MS (Java/Others)    Memory Limit: 65536/32768 K (Java/Others)Total Submi ...

  6. SQL递归查询知多少

    最近工作中遇到了一个问题,需要根据保存的流程数据,构建流程图.数据库中保持的流程数据是树形结构的,表结构及数据如下图: 仔细观察表结构,会发现其树形结构的特点: FFIRSTNODE:标记是否为根节点 ...

  7. js中的3种弹出式消息提醒(警告窗口,确认窗口,信息输入窗口)的命令式

    alert("A"); confirm("B");var name = confirm("B");if(name){ alert(" ...

  8. 使用python制作ArcGIS插件(5)其他技巧

    使用python制作ArcGIS插件(5)其他技巧 by 李远祥 使用python做插件开发,除了了解ArcToolBox工具之外,还需要在了解ArcPy的相关函数和接口.只有掌握了这些,才可以顺利的 ...

  9. final对于访问效率的影响

    在能够通过编译的前提下,无论局部变量声明时带不带final关键字修饰,对其访问的效率都一样. 并且:重复访问一个局部变量比重复访问一个成员或静态变量快:即便将其final修饰符去掉,效果也一样. 例如 ...

  10. bootstrap 字体图标

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...