<!DOCTYPE html>

<html>

<head lang="en">

    <meta charset="UTF-8">

    <title></title>

    <style>

        .center_box{

            width: 80%;

            height: 50%;

            position: absolute;

            top: 50%;

            left: 50%;

            transform: translate(-50%, -50%);

        }

    </style>

</head>

<body>

    <div class="center_box" style="border: 1px solid #f00; ">hhhhh</div>

</body>

</html>

让一个div在不同的显示器中永远居中的更多相关文章

  1. 解决div布局中第一个div的margin-top在浏览器中显示无效果问题。

    原味来源:http://www.hicss.net/do-not-tell-me-you-understand-margin/ 垂直外边距合并问题 别被上面这个名词给吓倒了,简单地说,外边距合并指的是 ...

  2. DIV+CSS在不同浏览器中的表现

     在给员工培训DIV+CSS的过程中.他们向我提出了非常多问题,有些问题我自己也没有想到过于是抽了些时间自己进行了一番实验,所有实验在IE7和Firefox中进行: 实验一.假设一个div没有指定 ...

  3. 一个Div在BOdy中上下左右居中

    在body中让一个DIv居中 上下左右 <body> <div style=" width:800px; height:500px; position:absolute; ...

  4. 利用css来让一个div在页面中垂直居中的方法

    一.如何让一个div在页面中垂直居中(请至少列出三种) 1.距离页面窗口左边框和上边框的距离设置为50%,这个50%就是指页面窗口的宽度和高度的50%,最后将该DIV分别左移和上移,左移和上移的大小就 ...

  5. 一个div在另一个div中水平垂直的方法

    html <div id="main"> <div id="box"> 一个div在另一个div中垂直居中实现方法 </div&g ...

  6. CSS中div覆盖另一个div

    将一个div覆盖在另一个div上有两种手段:一是设置margin为负值,二是设置绝对定位. 可以根个人情况设置z-index的值 1->position 为absolute的情况 <htm ...

  7. React中，input外边如果包一个div，可以把input的onChange事件绑定到div上面，并且也生效

    最近第一次开始学习封装组件,遇到几个比较神奇的问题. 首先就是如果input外边包一个div,如果把input的onChange事件绑定到div上,也会生效 <div onChange={(e) ...

  8. 一个div,包含两个div,调整文字位置和div平均分布

    网页中经常会用到,一个div下平均分布两个小的div,两个小的div,显示的内容为图片还比较好处理,显示文字则不好控制效果,今天写了一个如图效果的 html: <div class=" ...

  9. 【转】一个DIV+CSS代码布局的简单导航条

    原文地址:http://www.divcss5.com/shili/s731.shtml 简单的DIV CSS代码布局实现导航条 一个蓝色主题的导航条布局案例,本CSS小实例,采用DIV CSS实现. ...

随机推荐

  1. bat批处理设置Java JDK系统环境变量文件

    自己修改第3行的Java安装目录就可以设置JAVA_HOME, classPath,追加到PATH的最前面 JAVA_HOME=C:\Program Files\Java\jdk1.6.0_10 cl ...

  2. NEFU 503 矩阵求解 (非01异或的高斯消元)

    题目链接 中文题,高斯消元模板题. #include <iostream> #include <cstdio> #include <cmath> #include ...

  3. Bootstrap弹窗插件（拟态框）关闭后回调函数

    $(function(){ $('#questionnaire').on('hidden.bs.modal',function(){ //清除缓存方法 }); }); 事件 Bootstrap 的模态 ...

  4. [Android Pro] Android性能优化典范第一季

    reference to : http://www.cnblogs.com/hanyonglu/p/4244035.html#undefined 2015年伊始,Google发布了关于Android性 ...

  5. python基础——使用__slots__

    python基础——使用__slots__ 正常情况下,当我们定义了一个class,创建了一个class的实例后,我们可以给该实例绑定任何属性和方法,这就是动态语言的灵活性.先定义class: cla ...

  6. The Triangle

    针对如下形式的ACM试题,大多出自南阳理工学院的在线ACM试题(网址: 南阳理工在线评测系统),在此非常感谢,同时也非常感谢作者的分享! 时间限制:1000 ms  |  内存限制:65535 KB ...

  7. 关于安装Ubuntu后触摸板无法使用的解决方案

    安装了Ubuntu后发现触摸板无法使用,以为是修改了安装文件导致(之前拿安装源文件做了小实验),于是重装,之后触摸板仍无法使用,在一个长满小广告的页面上找到了解决方案. 以下是原文章内容: 最近突然发 ...

  8. 三、jQuery--jQuery基础--jQuery基础课程--第10章 jQuery UI型插件

    1.拖曳插件——draggable 拖曳插件draggable的功能是拖动被绑定的元素,当这个jQuery UI插件与元素绑定后,可以通过调用draggable()方法,实现各种拖曳元素的效果,调用格 ...

  9. 【转载】Pyqt 编写的俄罗斯方块

    #!/usr/bin/env python # -*- coding: utf-8 -*- from __future__ import print_function from __future__ ...

  10. Server.MapPath查询路径那几件事

    主要总结Server.MapPath 这个方法的使用以及使用的场景,不是什么时候都适合使用: 1.实现功能: Server.MapPath能够获取指定URL相对服务器的物理路径,在IIS服务端,能够根 ...