最近在做一个项目,里面涉及到不固定尺寸要在div里面水平垂直居中显示

我没有用table布局，而是用了div+css，找了很久,终于在网上找到解决方案,特此记录备用

关键核心代码如下:

<div style="width:400px;height:400px;border:1px solid red;display:table-cell;">
    <img src="01.jpg" style="vertical-align:middle;" />   
</div>

不要问我为什么，因为我也不明白为什么!哈哈哈，也希望哪一位大神可以帮我解开心里的问题

关于div中图片水平垂直居中的问题的更多相关文章

  1. CSS中图片水平垂直居中方法小结

    写页面时难免会遇到水平垂直居中的问题,总结一下最近使用的方法. 一.使用垂直居中和水平居中 <div id="div1"> <img src="img/ ...

  2. DIV以及图片水平垂直居中兼容多种浏览器

    纯css完美地解决图片以及div垂直水平居中,兼容IE7.0.IE6.0.IE5.5.IE5.0.FF.Opera.Safari具体实现css 如下,感兴趣的朋友可以参考下哈   第一种:全CSS控制 ...

  3. div+css:div中图片垂直居中

    div中图片垂直居中 <!DOCTYPE html> <html> <head> <meta charset="utf-8"> &l ...

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

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

  5. css中元素水平垂直居中4种方法介绍

    table-cell轻松设置文本图片水平垂直居中 让一个元素垂直居中的思路:把这个元素的容器设置为table-cell,也就是具有表格单元格的特性,再使用vertical-align(这个属性对blo ...

  6. CSS布局中的水平垂直居中

    CSS布局中的水平垂直居中 各位好,先说两句题外话.今天是我开通博客园的博客第一天,虽然我申请博客园的账号已经有一年半了,但是由于各种原因迟迟没有开通自己的博客.今天非常有幸开通博客,在此也写一篇关于 ...

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

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

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

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

  9. [转]如何让div中的内容垂直居中

    转自:http://blog.163.com/yan_1990/blog/static/197805107201211311515454/ 虽然Div布局已经基本上取代了表格布局,但表格布局和Div布 ...

随机推荐

  1. hdu1829 A Bug's Life 基础种类并查集

    题目的大意可以理解为:A爱B,B爱C ……给出一系列爱恋的关系,推断有没有同性恋. 思路是把相同性别的归为一个集合(等价类),异性的异性为同性. #include<iostream> #i ...

  2. 【Oracle】Rman简介

    1.备份和恢复功能的用途: –保护数据 -介质故障 -用户错误 -应用程序错误 –数据保存和历史数据保留 –数据传输 2.典型的备份和恢复任务 –通过配置数据库实现可恢复 –定义备份计划 –对不同类型 ...

  3. JS 封装一个求n~m的求和函数

    var a = 0;    cc(2,10);    function cc(n,m){        for(var i =n;i<(m+1);i++){            a = a + ...

  4. python海龟的使用

    ############################螺旋正方形############################### import turtle turtle.left(90)for i ...

  5. Python数据分析-----数据分类

    1.常见的分类算法主要有: (1)KNN算法 (2)贝叶斯方法 (3)决策树 (4)人工神经网络 (5)支持向量机(SVM) 2.KNN算法 (1)KNN应用场景: 比方说样本中有很多零食.很多电器. ...

  6. 【JavaScript框架封装】实现一个类似于JQuery的CSS样式框架的封装

    // CSS 样式框架 (function (xframe) { // 需要参与链式访问的(必须使用prototype的方式来给对象扩充方法)[只要是需要使用到this获取到的元素集合这个变量的时候, ...

  7. 小松之LINUX 驱动学习笔记（二）

    这两天一直在看字符驱动那块,后来从网上找啦几个例子,自己编译啦下,安装啥的都挺正常,就是用测试程序测试的时候总出问题,现在找到一个能测试的代码,自己先看看和原来的那个代码有啥不同,后面会继续更新,说下 ...

  8. （3）Spring Boot热部署【从零开始学Spring Boot】

    在编写代码的时候,你会发现我们只是简单把打印信息改变了下,就需要重新部署,如果是这样的编码方式,那么我们估计一天下来之后就真的是打几个Hello World之后就下班了.那么如何解决热部署的问题呢?那 ...

  9. java-org.dom4j常用api介绍

    //导入必要的包 import org.dom4j.Document;//Document文档类 import org.dom4j.Element//元素节点类 import org.dom4j.QN ...

  10. V$PROCESS和V$SESSION,以及使用这两个视图能做什么

    V$PROCESS和V$SESSION,以及使用这两个视图能做什么 http://blog.csdn.net/pan_tian/article/details/7731843 http://blog. ...