单行文字 （外行高度固定）

line-height 行高，
将line-height值与外部标签盒子的高度值设置成一致就可以了。
height:3em; line-height:3em;

多行文字

图文结合（图和单行文字）

图文结合（图和多行文字）

相对定位＋绝对定位，外层盒子设置position:relative，内层图片设置position:absolute

css中的垂直居中方法的更多相关文章

  1. CSS中各种居中方法

    CSS中各种居中方法,本文回顾一下,便于后续的使用. 水平居中方法 1.行内元素居中 行内元素居中是只针对行内元素的,比如文本(text).图片(img).按钮等行内元素,可通过给父元素设置 text ...

  2. css 中 div垂直居中的方法

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

  3. CSS中水平居中的方法

    居中是我们在css中经常遇到的问题,一般有水平居中.垂直居中.垂直水平居中这3种情况,那么今天首先就来对学习到的水平居中的方法做个总结笔记. css水平居中 text-align:center 它的效 ...

  4. css中div垂直居中的方法。

    利用绝对定位实现的居中 代码如下: <!DOCTYPE html> <html> <head> <meta charset="UTF-8" ...

  5. CSS元素水平垂直居中方法总结（主要对大漠以及张鑫旭博客所述方法进行了归纳）

    本文主要是对主流居中方法进行了归纳,有些地方甚至就是把别人的代码直接复制过来的,没有什么自己的东西,除了大漠以及张鑫旭的方法外,还有来自司徒正美.怿飞博客的几个方法 以下方法,由于测试环境的原因,IE ...

  6. CSS中各种各样居中方法的总结

    在开发前端页面的时候,元素的居中是一个永远都绕不开的问题.看似简单的居中二字,其实蕴含着许许多多的情况,对应着很多的处理方法,本文就试图对页面布局中的居中问题进行总结~~ 居中问题分为水平居中和竖直居 ...

  7. CSS中盒子垂直居中的常用方法

    在前端开发过程中,盒子居中是常常用到的.其中 ,居中又可以分为水平居中和垂直居中.水平居中是比较容易的,直接设置元素的margin: 0 auto就可以实现.但是垂直居中相对来说是比较复杂一些的.下面 ...

  8. css中vertical-align垂直居中的认识

    目标大纲 1.vertical-align为何不起作用?? vertical-align只钟情于“inline-block内联块级元素/inline元素” vertical-align属性 text- ...

  9. CSS中颜色表示方法及颜色表

    一:直接用颜色的英文名表示 二:RGB(x,y,z)函数表示,x.y.z.分别是红色.绿色.蓝色的值,x,y,z∈[0,225],亦可用百分比表示:对比rgba(x,y,z,a)中a是alpha通道设 ...

随机推荐

  1. 基于GBT28181：SIP协议组件开发-----------第二篇SIP组件开发原理

    原创文章,引用请保证原文完整性,尊重作者劳动,原文地址http://www.cnblogs.com/qq1269122125/p/3937590.html,qq:1269122125. 上一节中讲的S ...

  2. jQuery中的综合动画

    所谓综合动画,就是在链式表达式依次执行相关animate函数,其中的参数是以键值对的方式存在的. 如下示例,就展示了一个基本的综合动画. <!DOCTYPE html PUBLIC " ...

  3. Extjs中grid表格中去掉红三角

    在编辑Extjs的gridpanel的时候,数据有错误或是修改在每个单元格上都会出现红色的小三角,在每个列上面可以配置allowBlank: false来标识这个不可以为空 有的时候在保存数据时如果不 ...

  4. 常用排序算法总结（C#版）

    首先,说说几个排序中的概念. 1.稳定排序和非稳定排序  简单地说就是所有相等的数经过某种排序方法后,仍能保持它们在排序之前的相对次序,我们就说这种排序方法是稳定的.反之,就是非稳定的. 比如:一组数 ...

  5. 【行为型】Memento模式

    备忘录模式顾名思义就是一种能有备忘作用的设计模式,其目的是在对象外部保存其在某一时刻的状态信息,并且在任何需要的时候,都可以通过备忘录中保存的状态数据恢复对象在当时情形下的状态. 备忘录模式旨在对象的 ...

  6. struts2中IOC控制反转应用

    package com.bjsxt.struts2.user.action; import java.util.Map; import org.apache.struts2.interceptor.A ...

  7. DNS递归和迭代原理

    11.3.7 DNS递归解析原理 “递归解析”(或叫“递归查询”,其实意思是一样的)是最常见,也是默认的解析方式.在这种解析方式中,如果客户端配置的本地名称服务器不能解析的话,则后面的查询全由本地名称 ...

  8. Azure IoT

    微软Azure IoT   国外物联网平台初探(二)——微软Azure IoT 马智 平台定位 连接设备.其它 M2M 资产和人员,以便在业务和操作中更好地利用数据. 连接 IoT 设备 将所有设备连 ...

  9. centos7 jsoup java.net.UnknownHostException

    [root@localhost ~]# vi /etc/hosts127.0.0.1 localhost localhost.localdomain localhost4 localhost4.loc ...

  10. 利用Asio搭建日志系统

    Asio(http://think-async.com)官方示例中给出了一个比较初步的日志服务,主要代码在basic_logger.hpp.logger_service.hpp.logger_serv ...