<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. Python的字符编码

    Python的字符编码 1. Python字符编码简介 1. 1  ASCII Python解释器在加载.py文件的代码时,会对内容进行编码,一般默认为ASCII码.ASCII(American St ...

  2. 为开源社区尽一份力，翻译RocketMQ官方文档

    正如在上一篇文章中写道:"据我所知,现在RocketMQ还没有中文文档.我打算自己试着在github上开一个项目,自行翻译."我这几天抽空翻译了文档的前3个小节,发现翻译真的不是一 ...

  3. 局域网使用的IP地址范围

    局域网可用的IP地址范围为: A类地址:10.0.0.0 - 10.255.255.255  B类地址:172.16.0.0 - 172.31.255.255 C类地址:192.168.0.0 -19 ...

  4. 卡尔曼滤波（Kalman Filter）

    一.引言 以下我们引用文献[1]中的一段话作为本文的開始: 想象你在黄昏时分看着一仅仅小鸟飞行穿过浓密的丛林.你仅仅能隐隐约约.断断续续地瞥见小鸟运动的闪现.你试图努力地猜測小鸟在哪里以及下一时刻它会 ...

  5. 使用Mybatis-Generator自己主动生成Dao、Model、Mapping相关文件

    准备工作: 1.数据库驱动程序 2.generatorConfig驱动,(下载地址:https://github.com/mybatis/generator/releases) 3.generator ...

  6. 【剑指offer】扑克牌的顺子

    个大王,2个小王(一副牌原本是54张^_^)...他随机从中抽出了5张牌,想測測自己的手气,看看能不能抽到顺子,假设抽到的话,他决定去买体育彩票,嘿嘿! ."红心A,黑桃3,小王,大王,方片 ...

  7. Java面向对象的特征

    面向对象的特征 封装.继承.多态.(有人问第四个特征,再加抽象) 封装 体现形式(2种) 函数---提高代码的复用性 属性的私有化---将属性设置为私有的,通过提供对外的访问方法来间接操作对应属性,可 ...

  8. CentOS下nginx php mysql 环境搭建

    CentOS下搭建PHP运行环境. 首先是在虚拟机上装好一个命令行的CentOS,如果只是弄服务器的话,不要装图形界面,会比较卡. 一.安装编译工具及库文件 yum -y install make z ...

  9. flask中的session,render_template()第二和参数是字典

    1. 设置一个secret_key 2.验证登入后加上session,这是最简单,不保险 . 3.注意render_template传的参数是字典

  10. css经典布局—stick footer布局

    html部分 <div id="wrap"> <div id="main" class="clearfix"> &l ...