zoukankan      html  css  js  c++  java
  • 【图片垂直居中】解决方案

    <i class="i"><img src="http://p1.yokacdn.com/pic/index/121/2009/0318/U112P1T121D14F2761DT20100204144100.jpg" /></i>
    .i {display: table-cell;vertical-align:middle; text-align:center;*display: block;*font-size: 175px;*font-family:Arial;200px; height:200px; border: 1px solid #eee; }
    .i img { vertical-align:middle;}


    注意:此种方法,不能对<i>使用 float:left 属性,会导致垂直居中无效!


    注释:
    display: table-cell; —— 非IE的主流浏览器识别的垂直居中的方法
    text-align:center; —— 设置水平居中
    display: block; —— 针对IE的Hack
    font-size: 175px; —— 约为高度的0.873,200*0.873 约为175
    font-family:Arial; —— 防止非utf-8引起的hack失效问题,如gbk编码
    vertical-align:middle; —— 设置图片垂直居中

  • 相关阅读:
    修改IIS下默认的ASP.NET版本。
    smo算法
    支持向量机通俗导论
    二次规划
    交叉熵
    机器学习中的维数灾难
    矩阵与线性变换
    l2正则化
    Matlab 的reshape函数
    matlab 等值线函数 contour
  • 原文地址:https://www.cnblogs.com/enone/p/1782888.html
Copyright © 2011-2022 走看看