css图片垂直居中
一.style代码

    .case-pic{
height: 125px;
position: relative;
text-align: center
}
.case-pic span{
display: inline-block;
height: 100%;
vertical-align: middle;
}
.case-pic .img{
height: 60px;
vertical-align:middle;
}

二.html代码

<div class="case-pic"><span></span><img src="public/images/case_1.jpg" alt="" /></div>
												

css图片垂直居中的更多相关文章

  1. css 图片垂直居中总结

    1.利用vertical-align:middle: 父级元素设置成display:table-cell; 同级元素设置一个span标签 设置display:inline-block:图片样式设置ve ...

  2. CSS图片垂直居中方法

    让div里面的多行文本垂直居中的方法: div{height:100px;width:100px;border:solid 1px red;text-align:center; display:tab ...

  3. CSS图片垂直居中方法整理集合

    原帖链接:http://bbs.blueidea.com/thread-2666987-1-1.html 1.因为Opera,FF3,IE8均支持display:talbe;这些特性了,因此改进的办法 ...

  4. css垂直居中怎么设置?文字上下居中和图片垂直居中

    css 居中分css垂直居中和css水平居中,水平居中平时比较常用,这里我们主要讲css上下居中的问题.垂直居中又分为css文字上下居中和css图片垂直居中,下面我们就分别来介绍一下. css文字上下 ...

  5. css图片居中(水平居中和垂直居中)

    css图片居中(水平居中和垂直居中) css图片居中分css图片水平居中和垂直居中两种情况,有时候还需要图片同时水平垂直居中,下面分几种居中情况分别介绍. css图片水平居中 利用margin: 0 ...

  6. CSS让图片垂直居中的几种技巧

    在网页设计过程中,有时候会希望图片垂直居中的情况.而且,需要垂直居中的图片的高度也不确定,这就会给页面的布局带来一定的挑战.下面总结了一下,曾经使用过的几种方法来使图片垂直居中,除了第一种方法只限于标 ...

  7. 几种垂直居中的方式及CSS图片替换技术

    由于块级元素的高度是可以设置的,所以对于块级元素的垂直居中比较简单. 方法一: 在不定高的情况下,把元素的上下内边距设为同一个值即可实现,即padding :10px   0; 以上方法针对块级元素和 ...

  8. CSS中如何实现未知尺寸图片垂直居中

    在曾经的 淘宝UED 招聘 中有这样一道题目: “使用纯CSS实现未知尺寸的图片(但高宽都小于200px)在200px的正方形容器中水平和垂直居中.” 当然出题并不是随意,而是有其现实的原因,垂直居中 ...

  9. CSS设置图片垂直居中的方法

    如果是应用了表格,那么设置单元格为align="center"就可以使其中的一切内容居中.如果没有应用表格要想设置图片居中就有点困难了.困难来自不按"常规出牌" ...

随机推荐

  1. rc522 ,pn544区别

    请问 我们之前用的刷卡的  是用 rc522  ,,pn544和这个有什么区别? xqhrs232 (10:14:27): 支持的协议更多点吧! 春tian在哪里 (10:14:38): 比如? xq ...

  2. 【HDOJ】1356 The Balance

    扩展欧几里得的应用. /* 1356 */ #include <iostream> #include <sstream> #include <string> #in ...

  3. IPv6 tutorial 2 New features: Routing

    https://4sysops.com/archives/ipv6-part-2-new-features-routing/ Routing路由选择 In the last post of my IP ...

  4. 做最好的自己(Be Your Personal Best)

    成功——做最好的自己 价值观——成功源于诚信 积极主动——成功的选择在于自己 同理心——人际交往的基础 自信——用信心放飞自我 自省——在反思中走向成功 勇气——勇往直前的精神 胸怀——海纳百川的境界 ...

  5. cocos2dx 实用小技巧

    Menu 的 是个 很方便的 按钮 c2dx 默认为 MenuItemLabel 添加的 按下 变大 的 动画 却没有 给 MenuItemSprite 提供这样的效果 如果 自己 不想 封装新的 动 ...

  6. hadoop2.2编程:Tool, ToolRunner, GenericOptionsParser, Configuration

    继承关系:   1. java.util Interface Map.Entry<K,V> description: public static interface Map.Entry&l ...

  7. POJ2104 区间第k小

    题意就是区间第k大…… 题解: 前段时间用主席树搞掉了…… 如今看到划分树,是在想来写一遍,结果18号对着学长的代码调了一上午连样例都没过,好桑心…… 今天在做NOI2010超级钢琴,忽然发现用划分树 ...

  8. net 内存泄露和内存溢出

    一直以来都对内存泄露和内存溢出理解的不是很深刻.在网上看到了几篇文章,于是整理了一下自己对内存泄露和内存溢出的理解. 一.概念 内存溢出:指程序在运行的过程中,程序对内存的需求超过了超过了计算机分配给 ...

  9. SQL Server查询性能优化——堆表、碎片与索引(一)

    SQL Server在堆表中查询数据时,是不知道到底有多少数据行符合你所指定的查找条件,它将根据指定的查询条件把数据表的全部数据都查找 一遍.如果有可采用的索引,SQL Server只需要在索引层级查 ...

  10. ModelSim仿真

    (1)出现“Fatal: SDF files require Altera primitive library”  书上的方法是在ModelSim-SE下的使用,而我用的是ModelSim-Alter ...