<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>div居于页面正中间</title>

    <style type="text/css">

        *{

            margin: 0;

            padding: 0;

            background-color: #EAEAEA;

        }

        div{

            width: 200px;

            height: 200px;

            background-color: #1E90FF;

        }

        .center-in-center{

<!--        第一种：-->

                position: absolute;

                top: 0;

                left: 0;

                right: 0;

                bottom: 0;

                margin: auto;

<!--             第二种-->

<!--            position: absolute;-->

<!--            top: 50%;-->

<!--            left: 50%;-->

<!--            -webkit-transform: translate(-50%, -50%);-->

<!--            -moz-transform: translate(-50%, -50%);-->

<!--            -ms-transform: translate(-50%, -50%);-->

<!--            -o-transform: translate(-50%, -50%);-->

<!--            transform: translate(-50%, -50%);-->

        }

    </style>

</head>

<body>

    <div class="center-in-center"></div>

</body>

</html>

图片显示：

div 居中显示的更多相关文章

  1. 设置div中的div居中显示

    设置div中的div居中显示 方法一. <div class='big'> <div class='small'>box1</div> </div> s ...

  2. DIV居中显示

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  3. 让几个横向排列的浮动子div居中显示的方法

    div设置成float之后,就无法使子div居中显示了,那么如何让几个横向排列的浮动的div居中显示呢,下面有个不错的方法,希望对大家有所帮助 div设置成float之后,在父div中设置text-a ...

  4. 多个div居中显示

    页面中有多个div时我们希望并排居中显示,可以通过在并排显示的div上一层再加一个div,设定宽度,然后让其居中显示达到需要的效果. 关键是要对外层div设定宽度. <!DOCTYPE html ...

  5. css div居中显示的4种写法

    Demo:http://www.feman.cn/h5/center.html .absolute 绝对定位 这是我们最常用的一种居中定位写法 要求必须确定div的宽高度 目前市面上的浏览器基本上都支 ...

  6. 不固定宽度的div居中显示

    对于div的居中 ,如果是有固定宽高的,可以加margin:auto;水平垂直居中,但如果是不固定宽高,又想让div居中的话,这种方式都可能不奏效,达不到想要的效果. 有两种方法:1.加display ...

  7. 【HTML】div居中显示

    方法1: .parent { width:800px; height:500px; border:2px solid #000; position:relative; } .child { width ...

  8. 使用inline-block，使前面img,后面空div居中显示在一行后，导致当div中有内容时，div下移问题

    .pro_li img,.pro_sm{display: inline-block; *display:inline;*zoom:1;vertical-align: middle ;} 解决方法:使用 ...

  9. 【转】div居中代码 DIV水平居中显示CSS代码

    原文地址:http://www.divcss5.com/rumen/r622.shtml 如何使用CSS让DIV居中显示,让div水平居中有哪些CSS样式呢? 需要的主要css代码有两个,一个为tex ...

随机推荐

  1. .net core工具组件系列之Redis—— 第一篇：Windows环境配置Redis(5.x以上版本)以及部署为Windows服务

    Cygwin工具编译Redis Redis6.x版本是未编译版本(官方很调皮,所以没办法,咱只好帮他们编译一下了),所以咱们先下载一个Cygwin,用它来对Redis进行编译. Cygwin下载地址: ...

  2. CentOS7创建个人系统启动服务项的方法

    CentOS7.6自定义系统启动项的方法(类似busybox里面的inittab)1.编写属于自己的unit服务文件,命令为my.service[Unit]Description=My-demo Se ...

  3. 【剑指offer】28. 对称的二叉树

    剑指 Offer 28. 对称的二叉树 知识点:二叉树:递归 题目描述 请实现一个函数,用来判断一棵二叉树是不是对称的.如果一棵二叉树和它的镜像一样,那么它是对称的. 示例 输入:root = [1, ...

  4. 扩展欧几里得(exgcd)-求解不定方程/求逆元

    贝祖定理:即如果a.b是整数,那么一定存在整数x.y使得ax+by=gcd(a,b).换句话说,如果ax+by=m有解,那么m一定是gcd(a,b)的若干倍.(可以来判断一个这样的式子有没有解)有一个 ...

  5. javascript学习五---OOP

    面向对象:JavaScript的所有数据都可以看成对象 JavaScript的面向对象编程和大多数其他语言如Java.C#的面向对象编程都不太一样.如果你熟悉Java或C#,很好,你一定明白面向对象的 ...

  6. Python -- raw_input函数

    使用raw_input函数,它会把所有的输入当作原始数据(raw data),然后将其放入字符串中: >>> input("Enter a number: ") ...

  7. python 接口测试之 图片识别

    4.1 pytesser安装 2.安装pytesser,下载地址:http://code.google.com/p/pytesser/ ,下载后直接将其解压到项目代码下,或者解压到python安装目录 ...

  8. 【论文集合】机器翻译NMT中数据打分和数据选择的经典方法

    根据Survey of Data-Selection Methods in Statistical Machine Translation的总结,MT中的数据选择分类图如下: 使用场景 数据使用的场景 ...

  9. intouch制作历史趋势公用弹窗

    在先前项目中,历史趋势都是作为一个总体的画面,然后添加下拉菜单选择来配合使用.在新项目中,业主要求在相应的仪表上直接添加历史趋势,这就需要利用公用弹窗来制作历史趋势了. 1.窗体建立 窗体建立是比较简 ...

  10. Java代码中，如何监控Mysql的binlog？

    最近在工作中,遇到了这样一个业务场景,我们需要关注一个业务系统数据库中某几张表的数据,当数据发生新增或修改时,将它同步到另一个业务系统数据库中的表中. 一提到数据库的同步,估计大家第一时间想到的就是基 ...