Html:

<div id="MainContent"><img src="QQ截图20150515140512.png" width="" height=""></img></div>

  </div>

CSS:

#MainContent {

    display:table-cell;

    width: 700px;

    height: 800px;

    background: #0C78DD;

    text-align:center;

    vertical-align:middle; 

}

img 父元素有浮动属性的 话垂直对齐实现不了

CSS图片水平垂直居中的更多相关文章

  1. CSS制作图片水平垂直居中

    所谓的图片水平垂直居中就是把图片放在一个容器元素中(容器大于图片尺寸或是指定了大小的容器),并且图片位居此容器正中间(中间是指元素容器的正中间),而图片不是以背景图片(background-image ...

  2. css实现图片水平垂直居中

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  3. CSS制作水平垂直居中对齐

    作为前端攻城师,在制作Web页面时都有碰到CSS制作水平垂直居中,我想大家都有研究过或者写过,特别的其中的垂直居中,更是让人烦恼.这段时间,我收集了几种不同的方式制作垂直居中方法,但每种方法各有千秋呀 ...

  4. 图片水平垂直居中（兼容IE6，IE7，firefox，opera，safari，其中图片可以是任何块元素）

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  5. css实现水平 垂直居中

    css实现水平居中 <!DOCTYPE html> <html lang="en"> <head> <meta charset=" ...

  6. CSS制作水平垂直居中对齐 多种方式各有千秋

    作为前端攻城师,在制作Web页面时都有碰到CSS制作水平垂直居中,我想大家都有研究过或者写过,特别的其中的垂直居中,更是让人烦恼.这段时间,我收 集了几种不同的方式制作垂直居中方法,但每种方法各有千秋 ...

  7. CSS如何水平垂直居中？

    CSS如何水平垂直居中? 1.CSS如何实现水平居中? margin: 0 auto 2.CSS如何实现水平垂直居中? 首先设置一个div元素,设置背景颜色以便看出变化.代码如下: <!DOCT ...

  8. CSS实现水平|垂直居中漫谈

    利用CSS进行元素的水平居中,比较简单,手到擒来:行级元素设置其父元素的text-align center,块级元素设置其本身的left 和 right margins为auto即可.而撸起垂直居中, ...

  9. 纯CSS制作水平垂直居中“十字架”

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

随机推荐

  1. [原创]MOF提权下载者代码

    0x001 网上的mof提权 调用的是js执行添加用户 而且有个缺陷 还不能一步到位...目标3389也连不上...也不知道上面安装了什么软件...毛然添加用户也不好比如有个类似狗之类的拦截添加用户 ...

  2. docker搭建nginx+springboot集群

    1.首先准备两个springboot jar包,一个端口设置为8000,一个设置为8080. 2.打包第一个springboot jar包,Dockerfile如下 FROM java:8 VOLUM ...

  3. ssh的两个小知识

    ssh的两个小知识 1. 在ssh客户端启动远程服务器的图形界面程序. 如果你试图在ssh客户端运行远程服务器的一个图形界面程序,比如说执行firefox,此时可能会提示,can not connec ...

  4. A brief introduction to per-cpu variables

    墙外通道:http://thinkiii.blogspot.com/2014/05/a-brief-introduction-to-per-cpu.html per-cpu variables are ...

  5. MySQL之视图、触发器、事务、存储、函数、流程控制

    一.视图 视图就是一个虚拟表,我们把复杂的sql语句后看到的虚拟表封装起来,给他取个名字,当我们下次使用的时候,就不用再去写复杂的sql语句,直接调用封装后的视图名字,就可以得到我们想要的表,然后就可 ...

  6. Python知识梳理

    这是个人学习笔记,非教程,内容会有些混乱 极简教程     数据类型 我们可以使用type()函数类获取对象的类型,Python3中内置数据类型包括:None,int,float,complex,st ...

  7. java Future用法和意义一句话击破

    在并发编程时,一般使用runnable,然后扔给线程池完事,这种情况下不需要线程的结果. 所以run的返回值是void类型. 如果是一个多线程协作程序,比如菲波拉切数列,1,1,2,3,5,8...使 ...

  8. springboot整合freemarker----一点小小的错误

    最近小弟正在学习springboot,没办法,现在微服务太火了.小弟也要顺应时代的潮流啊 :( 好了,废话不多说了!!!! 首先在springboot的pom.xml添加freemarker的依赖 & ...

  9. tomcat版本号隐藏或修改

    tomcat版本号隐藏或修改 找到tomcat\lib\catalina.jar\org\apache\catalina\util\ServerInfo.properties文件 修改 server. ...

  10. Linux常用基本命令：三剑客命令之-awk动作用法(1)

    1,多个动作,怎么写? ghostwu@dev:~/linux/awk$ cat host.txt name ip地址 host1 192.168.1.1 host2 192.177.81.1 hos ...