示例1:

.div1{
width:200px;
height:300px;
border:1px solid #000;
position: relative;
}
.div2{
width: 40px;
height:40px;
background:green;
position: absolute;
margin: auto;
top:;
left:;
right:;
bottom:;
}

示例1 css部分

<div class="div1">
<div class="div2">居中</div>
</div>

示例1 html部分

示例2:

.div3{
width:200px;
height:300px;
border:1px solid #000;
display: table-cell;
vertical-align: middle;
}
.div4{
width: 40px;
margin: 0 auto;
}

示例2 css部分

<div class="div3">
<div class="div4">居中</div>
</div>

示例2 html部分

css让div水平垂直居中的更多相关文章

  1. 【最全】CSS盒子(div)水平垂直居中居然还有这种方式

    最全的CSS盒子(div)水平垂直居中布局,对CSS 布局掌握程度决定你在 Web 开发中的开发页面速度. 相对于屏幕 方法一:利用定位 <div class="box"&g ...

  2. css实现div水平垂直居中

    中秋快到了,祝大家中秋快乐. 平时大家写bug过程中肯定会遇到让div框水平或者垂直居中,然而有时候能居中,有时候不能居中.我把平时遇到的一些方法写出来,如果对你有用,那便是晴天. 1.text-al ...

  3. CSS实现DIV水平 垂直居中-1

    水平大家都知道,一般固定宽度给个margin:0 auto:就可以了.下面实现水平垂直都居中 HTML <div class="parent"> </div> ...

  4. Css控制div水平垂直居中显示

    <style>#info{height:0px; width:0px;top:50%; left:50%;position:absolute;}#center{background:#FF ...

  5. CSS控制DIV水平垂直居中

    <div style="position:absolute; width: 600px; height: 200px; left: 50%; top: 50%; margin-left ...

  6. DIV水平垂直居中的CSS兼容写法

    DIV水平垂直居中,非IE浏览器可以用CSS3来处理,IE浏览器中分别处理IE6和/IE7.IE8.IE9. 在IE低版本中,虽然大致上没有问题,但还是有一些细微的显示问题. 示例如下: <!D ...

  7. Flexbox制作CSS布局实现水平垂直居中

    Flexbox实现一个div元素在body页面中水平垂直居中: <!DOCTYPE html><html lang="en"><head>  & ...

  8. 如何让div水平垂直居中

    引子 我们经常遇到需要把div中的内容进行水平和垂直居中.所以,这里介绍一种方法,可以使div水平居中和垂直居中. 代码: <!DOCTYPE html> <html lang=&q ...

  9. 文字以及div水平垂直居中

    文字以及div水平垂直居中.md <div class=”content”> <div class=”mydiv”> huangyingnin! </div>< ...

随机推荐

  1. iOS8中添加的extensions总结(二)——分享扩展

    分享扩展 注:此教程来源于http://www.raywenderlich.com的<iOS8 by Tutorials> 1.准备 这次例子来源于国外的图片分享网站Imgur.com 首 ...

  2. PHP include 和 require

    PHP include 和 require 语句 在 PHP 中,您可以在服务器执行 PHP 文件之前在该文件中插入一个文件的内容. include 和 require 语句用于在执行流中插入写在其他 ...

  3. X-Y Problem

    X-Y Problem 对于X-Y Problem的意思如下: 1)有人想解决问题X2)他觉得Y可能是解决X问题的方法3)但是他不知道Y应该怎么做4)于是他去问别人Y应该怎么做? 简而言之,没有去问怎 ...

  4. Oracle数据库之PL/SQL游标

    1. 游标概念 字面意思是游动的光标,是指向上下文区域的句柄或指针. 在PL/SQL块中执行CRUD操作时,ORACLE会在内存中为其分配上下文区.用数据库语言来描述游标就是:映射在上下文区结果集中一 ...

  5. 【转】关于FPGA中建立时间和保持时间的探讨

      时钟是整个电路最重要.最特殊的信号,系统内大部分器件的动作都是在时钟的跳变沿上进行, 这就要求时钟信号时延差要非常小, 否则就可能造成时序逻辑状态出错:因而明确FPGA设计中决定系统时钟的因素,尽 ...

  6. How systems researchers build systems

    Define the problem >>Identify the constraints and abstract problem propose solution:simple ide ...

  7. Android系统的进程分类

    1.前台进程:即当前正在前台运行的进程,说明用户当前正在与通过该进程与系统进行交互,所以该进程为最重要的进程,除非系统的内容已经到不堪重负的情况,否则系统是不会将改进程终止的.2.可见进程:一般还是显 ...

  8. IC 小常识

    IC产品的命名规则: 大部分IC产品型号的开头字母,也就是通常所说的前缀都是为生产厂家的前两个或前三个字母,比如:MAXIM公司的以MAX为前缀,AD公司的以AD为前缀,ATMEL公司的以AT为前缀, ...

  9. C 語言中的編譯指示 (Pragma)

    編譯指示 #pragma 是用來告知編譯器某些特殊指示,例如不要輸出錯誤訊息,抑制警告訊息,或者加上記憶體漏洞檢查機制等.這些指示通常不是標準的 C 語言所具備的,而是各家編譯器廠商或開發者所制定的, ...

  10. php5,Apache在windows 7环境搭建

    主要是参考以下文章: http://www.cnblogs.com/Yogurshine/archive/2013/05/24/3097343.html http://jingyan.baidu.co ...