<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. PAT乙级：1056 组合数的和 (15分)

    PAT乙级:1056 组合数的和 (15分) 给定 N 个非 0 的个位数字,用其中任意 2 个数字都可以组合成 1 个 2 位的数字.要求所有可能组合出来的 2 位数字的和.例如给定 2.5.8,则 ...

  2. vue3 自学（一）基础知识学习和搭建一个脚手架

    两年前曾自学过几天vue,那时候版本还是vue2,但后来项目中一直没用到,当时也觉得学习成本太高,便没有继续学习下去.初学者可以看下链接文章以前的吐槽~~ 学习 Vue ,从入门到放弃 最近部门决定升 ...

  3. API接口测试

    一.测试工具 二.测试方法 二.测试需要注意的点

  4. css文件编码

    当css文件的编码

  5. ffuf 基础食用指南

    PS: 1. 下文出现的某些字典 有可能是因为摆出效果 我自己瞎搞得字典 2. 分享一些好的工具 3. 其实Wfuzz也很好用的 4. 很早之前就在语雀写过Wfuzz和ffuf的笔记 但是一直没有公开 ...

  6. 使用simg2img win提取安卓官方ROM包中独立的系统软件

    一.背景 今天是七夕情人节诶,但是与我一只单身老狗有啥关系呢?一大早发现手机系统更新了(MIUI12.5 增强版),但是更新完后感觉充电速度不是很妙(你们懂得),为了恢复之前的充电速度,首先想到将手机 ...

  7. 更换Swing界面中的窗口图标

    Swing 窗口图标更换 因为需要,所以要更改窗口的图标,很简单 在代码中加上 Image icon = Toolkit.getDefaultToolkit().getImage("图片地址 ...

  8. brew换源

    转自:https://blog.csdn.net/gorwayne/article/details/107359912 第一步,替换brew.git cd "$(brew --repo)&q ...

  9. Spring的@PropertySource注解使用

    @PropertySource注解是Spring用于加载配置文件,默认支持.properties与.xml两种配置文件.@PropertySource属性如下: name:默认为空,不指定Spring ...

  10. Easylogging++的使用及扩展

    目录 简介 使用 扩展 配置日志路径 时间滚动日志 自动删除日志 封装到一个头文件 源代码优化(不推荐) 附件 简介 Easylogging++ 是用于 C++ 应用程序的单头高效日志库.它非常强大, ...