1. <div class="parent">
  2. <div class="child">123</div>
  3. </div>

 css样式使div以表格的特性表现:

  1. .parent {
  2. width: 400px;
    height: 360px;
  3. display: table;
  4. text-align: center;
  5. }
  6. .child {
  7. display: table-cell;
  8. vertical-align: middle;
    }

居中效果是这样:

高宽不定的div相对父div上下、左右居中的更多相关文章

  1. 【html】【8】div布局[子div在父div居底]

    从今天起 开始细话div布局   思路及要点: 父div的位置设置成相对的,即“position: relative;”. 而子div的位置设置成绝对的,并且下边缘设为0,即“position: ab ...

  2. 转载 html div三列布局占满全屏(左右两列定宽或者百分比、中间自动适应,div在父div中居底)

    原文地址:http://blog.csdn.net/duyelang/article/details/20558899 <p><!DOCTYPE html> <html ...

  3. CSS+DIV:父DIV相对定位+子DIV绝对定位

    如何在一个div内将一个div进行绝对定位呢?很简单,把父div的position属性设为relative,子div的position属性设为absolute就可以了... 示例: <html& ...

  4. 解决div和父div不上对齐

    加一个vertical-align: top;就好了.原因就是inline-block会使元素向下对齐.这和padding-top,margin-top没有关系的.使用浮动就不会有这种情况了,当然会带 ...

  5. css 子div自适应父div高度

    <div class="out"> <div class="a"></div> <div class="b& ...

  6. html中子div用了浮动怎样让父div的大小自动撑开(清除浮动)

    浮动子div撑开父div的几种方法: (1)在父div中在添加一个清除浮动的子div<div style=" clear:both;"></div>,该di ...

  7. css 设置div基于父元素宽度的宽高相等的样式

    1. 前言 在移动开发中,有时候需要设置一个宽高相等的div,并且为了使它能够适配更多的屏幕,于是需要让它的宽高和屏幕宽高成一定的比例.这里将提供一个css的解决方案,让一些后端开发不用再写繁琐的js ...

  8. 未知高宽的div在其父级div中垂直居中显示

    (一)如果已知子div的高宽 .father { position: relative; } .child { width: 100px; height: 80px; position: absolu ...

  9. 不固定高宽的 div 水平垂直居中

    <div class="father"> <div id="main"></div> </div> .fathe ...

随机推荐

  1. XAMPP PHP redis 扩展

    1.php增加redis扩展 echo phpinfo();exit;查看php 版本以及 vc运行库 可知 X86 MSVC11  PHP5.6   首先把对应版本的php_redis.dll 和 ...

  2. PHP unset 后恢复数组索引

    unset($arr[3]); $arr = array_values($arr); array_values() 函数返回一个包含给定数组中所有键值的数组,但不保留键名,被返回的数组将使用数值键,从 ...

  3. 使用swfupload上传超过30M文件,使用FLASH上传组件

    原文:使用swfupload上传超过30M文件,使用FLASH上传组件 前一段时间会员的上传组件改用FLASH的swfupload来上传,既能很友好的显示上传进度,又能完全满足大文件的上传. 后来服务 ...

  4. 【转】给npm设置代理

    可以运行如下两句命令设置代理,注意代理的地址改为自己实际可用的代理. npm config set proxy=http://127.0.0.1:8087 npm config set registr ...

  5. MyBatis操作指南-搭建项目基础环境(基于XML)含log4j配置

  6. [原创]NDT方法在SLAM中的应用

    NDT概念 正态分布变换(Normal Distribution Transformation , NDT)概率密度函数( Probability Density Function, PDF)Firs ...

  7. cmdb models数据库结构

    from __future__ import unicode_literals from django.contrib.auth.models import User from django.db i ...

  8. webservice的简单示例的实现步骤

    前段时间在webservice的问题上纠结了很长时间,本来想写在thinkphp的框架里面,可是怎么也实现不了,目前为止也仅仅是学会的没有框架的接口的开发. 在此资源共享一下步骤: 首先我创建的文件有 ...

  9. Preconditions优雅的检验参数

    Preconditions里面的方法: 1 .checkArgument(boolean) : 功能描述:检查boolean是否为真. 用作方法中检查参数 失败时抛出的异常类型: IllegalArg ...

  10. winform下的智能提示框

    winform下的智能提示框 最近在搞winform的程序,接触到有些可能以后还会用到的功能,所以写到博客园里去,第一可以加深自己的印象,第二可以在以后再遇到同样问题的时候忘记了可以马上回来看看,第三 ...