html

<body>

    <div id="centerDiv">自动适应水平和垂直居中</div>

</body>

css

*{margin:;padding:;}

    #centerDiv{width:834px; height:550px; border:1px solid #9f9f9f;

             position:absolute;

             left:50%;margin-left:-417px;

             top:50%;margin-top:-275px;

         }

原理就是:先用left:50%;top:50%让这个div的左上角居于页面的正中,然后用margin-left:-417px;margin-top:-275px;使div向左向上移动它自身宽高的一半.

div自动适应浏览器窗口水平和垂直居中的更多相关文章

  1. 让div等块级元素水平以及垂直居中的解决办法

    一.背景 我们在设计页面的时候,经常要把div等块级元素居中显示,而且是相对页面窗口水平和垂直方向居中显示,如让登录窗口居中显示.我们传统解决的办法是用纯CSS来让div等块级元素居中.在本文中,我将 ...

  2. 如何让DIV在窗口水平和垂直居中

    本实例以新文档开始 2 先放置一个div,并且设置class名为aa,赋予它css属性: width:0;height:0;position:fixed;left:50%;rigth:50%;top: ...

  3. css系列（布局）：实现一个元素在浏览器中水平、垂直居中的几个方案

    在开发中偶遇需要一个元素垂直居中的需求,之前都是水平居中,垂直居中使用的比较少,经过一通研究,选择了几种相对比较实用的方案分享,抛砖引玉,如有遗漏不足,还望不吝指正. 方案一(IE7下该方案无法实现垂 ...

  4. div高度随浏览器窗口高度变化；

    通过实际测试,按照网上的说法通过设置html,body{height: 100%:}, 然后让div以100%继承body的高度,这种做法是错误的,必须得上级有个设置固定的高度. 原生js代码(参照网 ...

  5. 让div自适应浏览器窗口居中显示

    今天做 banner 时发现一个问题,就是浏览器窗口水平拉伸时 banner 图未能居中,所以网上找了些资料,自己写了个小 demo html代码: <div class="div1& ...

  6. div在浏览器窗口中居中

    让div相对于浏览器窗口居中. 方案一:纯粹使用CSS实现 <!DOCTYPE html> <html> <head> <meta charset=" ...

  7. 动态获取div的高度 随着窗口变化而变化

    // 1.jq法 <script> var winHeight = $(window).height(); $("#show").css("height&qu ...

  8. JS小积累（二）— 自动获取浏览器尺寸

    JS小积累-获取浏览器窗口尺寸 作者: 狐狸家的鱼 GitHub:八至 autodivheight(); function autodivheight() { //函数:获取尺寸 //获取浏览器窗口高 ...

  9. 让div垂直居中于浏览器窗口

    <style type="text/css">  div  {   position:absolute;   top:50%;   left:50%;   margin ...

随机推荐

  1. Oracle 数据库连接的一些坑

    问题: ORA-12504:TNS:监听程序在CONNECT_DATA中未获得SERVICE_NAMEORA-12514: TNS: 监听程序当前无法识别连接描述符中请求服务 解决办法: 1 权限 安 ...

  2. POJ 2823 Sliding Window & Luogu P1886 滑动窗口

    Sliding Window Time Limit: 12000MS   Memory Limit: 65536K Total Submissions: 66613   Accepted: 18914 ...

  3. C++中的各种进制转换函数汇总及学习

    一.指定格式输出 1.C中指定格式输出 printf(); //按八进制格式输出,保留5位高位补零 printf(); //按十进制格式输出,保留3位高位补零 printf(); //按十六进制格式输 ...

  4. django访问静态变量的设置

    在项目的urls.py文件中 默认urlpatterns是空的列表需要填入url匹配的路由,默认使用static from django.conf.urls import include, url f ...

  5. MINSUB - Largest Submatrix

    MINSUB - Largest Submatrix no tags  You are given an matrix M (consisting of nonnegative integers) a ...

  6. oracle 增量导出/导入

    一.   导出/导入(Export/Import) ----   利用Export可将数据从数据库中提取出来,利用Import则可将提取出来的数据送回Oracle数据库中去. ----   1.   ...

  7. code vs 2166 Bessie的体重问题

    2166 Bessie的体重问题  时间限制: 1 s  空间限制: 32000 KB  题目等级 : 黄金 Gold 题解       题目描述 Description Bessie像她的诸多姊妹一 ...

  8. N天学习一个linux命令之umask

    前言 umask不是linux命令,而是shell内置的指令,俗称用户权限掩码,用于对用户创建的文件和目录设置默认权限.默认的权限掩码是0022,也就是说新创建的文件权限是0644,新创建的目录权限是 ...

  9. HYAppFrame(WinForm框架源代码)安装部署指南

    HYAppFrame是一款基于Win form的应用程序框架,包括serverWeb Service.主程序框架.组织架构.权限控制.菜单导航.基础数据.系统參数.日志管理.定时任务等. 项目地址:h ...

  10. Android面试准备 第一天 第2-4例

    參考:http://blog.csdn.net/lmj623565791/article/details/24015867. .假设有个100M大的文件.须要上传至server中.而serverfor ...