<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. A trip through the Graphics Pipeline 2011_10_Geometry Shaders

    Welcome back.     Last time, we dove into bottom end of the pixel pipeline. This time, we’ll switch ...

  2. 在 MVC4 中使用 Uploadify 3.2 - 1

    Uploadify 是 JQuery 一个著名的上传插件,利用 Flash 技术,Uploadify 越过浏览器的限制,控制了整个上传的处理过程,实现了客户端无刷新的文件上传,这样就实现了在客户端的上 ...

  3. ios-获取商店已上线app信息

    NSString *url = [[NSString alloc] initWithFormat:@"http://itunes.apple.com/lookup?id=%@",@ ...

  4. J2EE用户CPU占用过大后的分析过程

        1.找到最耗CPU的java线程ps命令 命令:ps -mp pid -o THREAD,tid,time   或者  ps -Lfp pid 结果展示:            2.可以获取到 ...

  5. xcode 6 创建的工程上下有黑边

  6. Android Http请求方法汇总

    [转]  原文 这篇文章主要实现了在Android中使用JDK的HttpURLConnection和Apache的HttpClient访问网络资源,服务端采用python+flask编写,使用Serv ...

  7. Bomb---hdu5934(连通图 缩点)

    题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=5934 题意:有n个炸弹,每个炸弹放在(x, y)这个位置,它能炸的范围是以 r 为半径的圆,手动引爆这 ...

  8. 换手率的公司使用MQTT的框架

    向换手率公司学习.该公司貌似也使用 Golang

  9. c# signalr聊天室开源资料

    SignalR+LayIM源码: http://www.cnblogs.com/panzi/p/5742089.html 钉钉客户端源码: http://www.cnblogs.com/loveson ...

  10. cat *.txt | grep '>' | wc -l

    find the line where the '>' located, and make a statistic.