<div class="parent">
<div class="child">123</div>
</div>

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

.parent {
width: 400px;
height: 360px;
display: table;
text-align: center;
}
.child {
display: table-cell;
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. linux下开启防火墙,打开端口

    service iptables start时提示:“iptables: No config file.                                  [WARNING]” 此时打 ...

  2. 关于js SDK的程序,java SDK的程序

    一:JS SDK 1.修改配置workspace 2.导入 3.Demo.html <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Trans ...

  3. 构建Logstash+tomcat镜像(让logstash收集tomcat日志)

    1.首先pull logstash镜像作为父镜像(logstash的Dockerfile在最下面): 2.构建my-logstash镜像,使其在docker镜像实例化时,可以使用自定义的logstas ...

  4. linux下安装编译php的curl扩展

    curl扩展的位置(需要编译的版本)/root/install/php-5.5.24/ext/curl 1.进入对应的扩展目录 # cd /root/install/php-5.5.24/ext/cu ...

  5. kernel update 2.6.18-2.6.38

    细致某种程度上可以体现作者的开放精神 copy for build a note needed when config the kernel 主要的问题出在了menu.lst 和 grub.conf文 ...

  6. Anaconda安装与使用

    bash Anaconda.....sh命令安装成功 安装位置:/home/amelie/anaconda2 修改路径:vi ~/.bashrc vi编辑器在最后写上:export PATH=/hom ...

  7. Latex 分段函数

    Latex里面分段函数的输入: \begin{equation}     P_{r-j}=    \begin{cases}    0&\mbox{if $r-j$ is odd}\\     ...

  8. 响应式布局2--MATE

    随着高端手机(Andriod,Iphone,Ipod,WinPhone等)的盛行,移动互联应用开发也越来越受到人们的重视,用html5开发移动应用是最好的选择.然而,每一款手机有不同的分辨率,不同屏幕 ...

  9. li ul 说明

    复制代码代码如下: <div id="menu">  <ul>  <li><a href="#">首页</ ...

  10. c#与.net的简介

    c语言诞生于上世纪60年代,后来诞生了面向对象的c++,后来出现看更为精简的java,微软之后又出了c#语言.早期的c#语言和java语言类似.经过长足的发展,c#变得越来越完美. 面向对象 简单,安 ...