<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. junit测试框架

    import junit.framework.Assert; import org.junit.After; import org.junit.Before; import org.junit.Tes ...

  2. 使用 Sublime Text3 编辑 Markdown

    安装插件 可以通过安装 Markdown 的插件来使 Sublime Text3 变成一款 Markdown 编辑器 1.Markdown Preview 插件 输入Shift + Ctrl + P, ...

  3. 利用脚本获取mysql的tps,qps等状态信息

    #!/bin/bash mysqladmin -uroot -p'123456' extended-status -i1|awk 'BEGIN{local_switch=0;print "Q ...

  4. Thinking in Java——笔记(1)

    Introduction To Obejct The progress of abstraction But their primary abstraction still requires you ...

  5. 解决ssh登录后闲置时间过长而断开连接

     ++++++++++++++++++++++++++++ #!/usr/bin/env bash password_5="Uxxx7"host_5="129.x.x.1 ...

  6. php连接和操作mysql数据库

    <?php //数据库连接文件:link.php $link = mysql_connect("localhost", "root", "&qu ...

  7. Windows平台配置免安装的MySQL

    1.下载 官网下载免安装文件(本文使用的是mysql-5.6.33-win32.zip)解压到E:\MySQL\mysql-5.6.33打开E:\MySQL\mysql-5.6.33\my-defau ...

  8. XSS (Cross Site Scripting) Prevention Cheat Sheet(XSS防护检查单)

    本文是 XSS防御检查单的翻译版本 https://www.owasp.org/index.php/XSS_%28Cross_Site_Scripting%29_Prevention_Cheat_Sh ...

  9. mac上mysql乱码问题解决

    一.mysql出现乱码问题: 出现的问题是下图这样的乱码问题,我是使用java在做练习的时候发现出现字符集编码问题的: 当时是使用jdbc来添加的数据,我的jdbc包括web前端后端的编码都是设置的是 ...

  10. 友善p35屏

    友善p35 屏,x轴方向从左往右移(0——>320),Y轴方向从上往下开始(0——>240)