<BODY>
<div class="box">
<span class="car"></span>
<img src="data:images/01.jpg" title="car" />
</div>
</BODY>

.box {
width: 100%;
overflow: hidden;
text-align: center;
/*font-size: 0;*/
border: 1px solid #000000;
margin: 50px auto;
}
.box .car {
display: inline-block;
width: 0;
height: 100%;
font-size: 0;
line-height: 0;
vertical-align: middle;
}
.box img {
vertical-align: middle;
}

参考：http://linxz.github.io/tianyizone/middle_02.html

未知宽高图片水平垂直居中在div的更多相关文章

  1. CSS未知宽高元素水平垂直居中

    方法一 :table.cell-table 思路:显示设置父元素为:table,子元素为:cell-table,这样就可以使用vertical-align: center,实现水平居中优点:父元素(p ...

  2. table-cell实现未知宽高图片，文本水平垂直居中在div

    <BODY> <h1>未知宽高的图片水平垂直居中在div</h1> <!--box-outer--> <div class="box-o ...

  3. css两种常用的不定宽高的水平垂直居中方法，记住它，不再为样式发愁

    css 几种常用的简单容易记住的水平垂直居中方法 前言 正文 第一种方法 第二种方法 结束语 前言 我们在设计网页时,会大量的运用到水平垂直居中,如果知道元素的宽高,那水平垂直居中是很简单的,无非是用 ...

  4. IOS UITableView 加载未知宽高图片的解决方案

    在开发中遇到了UITableView列表 UITableViewCell装载图片但不知Image的宽高 问题. 在解决该问题的时候,首先想到的是异步加载图片 采用第三方框架SDWebImage 实现对 ...

  5. 纯CSS实现图片水平垂直居中于DIV（图片未知宽高）

    <div class="demo"><a href="#"><img src="http://nec.netease.c ...

  6. css/css3实现未知宽高元素的垂直居中和水平居中

    题目:.a{ width: 200px; height: 200px; background-color: #ccc;} <body> <div class="a" ...

  7. 未知宽高div水平垂直居中3种方法

    <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> </head&g ...

  8. 已知宽高和未知宽高的div块的水平垂直居中

    //已知宽高的情况 .div1_container{     border:1px solid #00ee00;     height:300px;     position:relative; } ...

  9. div+css实现未知宽高元素垂直水平居中

    div+css实现未知宽高元素垂直水平居中.很多同学在面试的时候都会遇到这样的问题:怎么用div+css的方法实现一个未知宽高的弹出框(或者图片)垂直水平居中??如果用JS的话就好办了,但是JS的使用 ...

随机推荐

  1. 【练习】HTML+CSS

    作业要求1 京东首页轮播图,效果如下 <!DOCTYPE html> <html lang="en"> <head> <meta char ...

  2. 【Win 10 应用开发】MIDI 音乐合成——乐理篇

    针对 MIDI 音乐的 API ,其实在 Win 8.1 的时候就出现.在UWP中采用了新的驱动模式,MIDI 消息传递更加高效. 首先得说明的是,UWP 的 MIDI 相关 API 不是针对 MID ...

  3. ssh服务、密钥登陆配置

    环境内核信息: [root@zabbix-01 ~]# uname -a Linux lodboyedu-01 2.6.32-696.el6.x86_64 #1 SMP Tue Mar 21 19:2 ...

  4. Java----前端验证之验证码额实现

    验证码是常用的登录验证方式之一,最大的作用就是保证安全,验证码的生成在java中实现的方式有很多种,比如后台生成传输到前端页面,在前台直接生成进行验证,下面写一个最简单实现验证码验证登录的例子. 生成 ...

  5. HDU 1013.Digital Roots【模拟或数论】【8月16】

    Digital Roots Problem Description The digital root of a positive integer is found by summing the dig ...

  6. IT运维如何防止陷入“中年油腻”和频繁被动地打“遭遇战”？

    欢迎大家前往腾讯云社区,获取更多腾讯海量技术实践干货哦~ 作者:陈峻近期,我拜访了一家文化传播公司的 IT 运维总监 Tim,他向我讲述了他的团队是如何像当年玩<大航海时代>那样将 IT ...

  7. 自学Python5.4-内置模块(2)

    内置模块(2) 7. xml8.conf9.requests10.logging11.paramiko12.time & datetime 时间相关的操作,时间主要分三种表示方式: 时间戳   ...

  8. 中国IT职业培训市场经历的几波浪潮，未来的浪潮又是那一波？

    第一波 电脑普及性培训时代 2000年至2003年左右,中国正处于PC计算机普及阶段,而IT职业教育也刚开始兴起,这一波浪潮主要以计算机办公自动化.平面设计.计算机硬件维修.为主:几家大的IT培训机构 ...

  9. ed命令

  10. 【java】HashMap、Map、Set、HashMap.put()、HashMap.keySet()、HashMap.entrySet()、Map.Entry内部类

    package com.tn.hashMap; public class Student { private String id; private String name; public Studen ...