一直以来都没有找到一种完美解决DIV垂直居中的方法,今天终于找到了,特记录如下,从此不再用table来居中了。^^

 <html>
<style>
#image{
width:500px;
height:500px;
background:#fff000;
text-align: center;
overflow: hidden;
}
#image img {
    vertical-align: middle;
   }
#block {
width: 0px;
height: 100%;
}
</style>
<body>
<div id="image">
<img src="http://www.mm21.cn/dimg6/qqtu/201105/20110507234620615.jpg"/>
<img src="" id="block"/>
</div>
</body>
</html>

DIV的垂直居中的更多相关文章

  1. 单个未知大小图片在div里面垂直居中的方法。。。添加辅助元素挤一下位置达到居中

    单个未知大小图片在div里面垂直居中的方法...添加辅助元素挤一下位置达到居中   <div class="ServicesLiTopPic"> <i>&l ...

  2. css参考文档; 官方英文说明!! 1 margin padding 百分比参照物 2 margin值为auto时的说明 3 div在div里垂直居中方法 4 dispaly:flex说明

    css参考文档        http://css.doyoe.com/ 两篇很好的文章:(下面的css官方英文说明链接 有时间可以研究下 http://www.w3.org/TR/css3-box/ ...

  3. 如何让div水平垂直居中

    引子 我们经常遇到需要把div中的内容进行水平和垂直居中.所以,这里介绍一种方法,可以使div水平居中和垂直居中. 代码: <!DOCTYPE html> <html lang=&q ...

  4. 文字以及div水平垂直居中

    文字以及div水平垂直居中.md <div class=”content”> <div class=”mydiv”> huangyingnin! </div>< ...

  5. 【笔记】让DIV水平垂直居中的两种方法

    今天写的了百度前端学院春季班的任务:定位和居中问题  由于距离上次学习CSS有点久远了,加上以前木有记笔记的习惯,方法忘得只剩下一种,今天通过网上查阅资料总结了以下两种简单的方法让DIV水平垂直居中. ...

  6. DIV内容垂直居中

    css垂直居中属性设置vertical-align: middle对div不起作用,例如: <!DOCTYPE html> <html lang="zh-CN"& ...

  7. div+css 怎么让一个小div在另一个大div里面 垂直居中

    div+css 怎么让一个小div在另一个大div里面 垂直居中 方法1: 1 2 3 4 5 6 7 8 9 10 11 12 13 14 .parent {           width:800 ...

  8. DIV水平垂直居中的CSS兼容写法

    DIV水平垂直居中,非IE浏览器可以用CSS3来处理,IE浏览器中分别处理IE6和/IE7.IE8.IE9. 在IE低版本中,虽然大致上没有问题,但还是有一些细微的显示问题. 示例如下: <!D ...

  9. Div水平垂直居中的三种方法

    百度了很多种方法,很多是不起作用的.下面这些方法是我亲自试过的.希望对大家有帮助! 下面是一波代码水军. <!DOCTYPE html> <html lang="en&qu ...

  10. scss : div水平垂直居中

    scss 是一个很好用的css预处理语言,有很多很好的特性. 比如 mixin. 我们可以像使用函数那样使用mixin. 比如写一个div水平垂直居中. 上代码. @mixin absolute_ce ...

随机推荐

  1. java常见类型的转化以及风险

    呵呵呵 参考:http://zhangyuefeng1983.blog.163.com/blog/static/1083372520126693524870/

  2. 漫水填充算法 - cvFloodFill() 实现

    前言 漫水填充算法是用来标记一片区域的:设置一个种子点,然后种子点附近的相似点都被填充同一种颜色. 该算法应用性很广,比如目标识别,photoshop 的魔术棒功能等等,是填充类算法中应用最为广泛的一 ...

  3. platanus

    nohup  platanus assemble -o Larrrea -f ../unknown_NoIndex_L000_R1.fastq ../unknown_NoIndex_L000_R2.f ...

  4. Foobar音乐播放器——最佳音乐播放器 - imsoft.cnblogs

    简单皮肤 下载地址:链接: http://pan.baidu.com/s/1kTwn2dh 密码: lf5f

  5. 简单选择排序算法(C++版)

    #include <iostream> using namespace std; /** Simple Select Sort * brief: * Key: * * position: ...

  6. 比较compareTo与equals及==的区别

    1.compareTo: 附上:源码: public int compareTo(String anotherString) {         int len1 = value.length;   ...

  7. poj 3320 技巧/尺取法 map标记

    Description Jessica's a very lovely girl wooed by lots of boys. Recently she has a problem. The fina ...

  8. 学号20145220 《Java程序设计》第5周学习总结

    学号20145220 <Java程序设计>第5周学习总结 教材学习内容总结 语法与继承结构 8.1.1使用try.catch java中所有的错误都会被打包为对象,并提供了特有的语句进行处 ...

  9. 【转】IOS静态库a文件制作流程

    原文网址:http://www.jianshu.com/p/3439598ea61f 1.新建Cocoa Touch Static Library工程 新建工程 2.Xcode的参数设置 " ...

  10. EXTJS 5.0 资料

    http://blog.csdn.net/sushengmiyan/article/category/2435029