转自:http://blog.sina.com.cn/s/blog_65d41dff0100v0iz.html

其实解决的思路是这样的:首们需要position:absolute;绝对定位。而层的定位点,使用外补丁margin负值的方法。负值的大小为层自身宽度高度除以二。

代码:

<style type="text/css">

<!--

#content{ width:402px;height:302px;position:absolute;top:50%;left:50%;margin:-151px 0 0 -201px;border:1px solid red;}

-->

</style>

<div id="content"></div>

让DIV在屏幕上下左右居中的更多相关文章

  1. HTML+CSS,让div在屏幕中居中(水平居中+垂直居中)方法总结

    最近写网页经常需要将div在屏幕中居中显示,遂记录下几个常用的方法,都比较简单. 水平居中直接加上<center>标签即可,或者设置margin:auto;当然也可以用下面的方法 下面说两 ...

  2. css div相对屏幕永远居中

    不管屏幕如何滑动,该div始终保持在屏幕正中央(支持IE7(包括IE7)以上版本) <div class="loginBox"></div> .loginB ...

  3. css div上下左右居中

    相信大家都会遇到这样的问题,要求一个块上下左右居中,在这里我总结了几个好用的方法 1.已知要居中的块width height 假设  content 要在f里上下左右居中 <div class= ...

  4. css:子元素div 上下左右居中方法总结

    最近在面试,不停地收到了知识冲击,尤其是对于一些基础的css.html.js问题居多,所以自我也在做反思,今天就css问题,如何让一个子元素div块元素上下左右居中 (以下总结方法,都已得到验证). ...

  5. div元素上下左右居中

    <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <m ...

  6. 用CSS让DIV上下左右居中的方法

    转载自喜欢JS的无名小站 例如 一个父div(w:100%;h:400px)中有一个子div(w:100px;100px;).让其上下左右居中. 方法一(varticle-align) 理念 利用表格 ...

  7. div层上下左右居中

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

  8. 使用jQuery在屏幕上居中一个DIV

    文章目录 我如何去使用jQuery在屏幕的中心设置<div>? 我喜欢给jQuery添加函数,所以这个函数将有助于: jQuery.fn.center = function () { th ...

  9. 只用CSS实现容器内图片上下左右居中

    一直以来,大家都知道,DIV容器内设置 text-align:center 即可让图片居中,但是DIV内默认的图片是上对齐,不会上下居中,如果想要实现这样的效果,JS判断是比较麻烦的,因为DIV容器内 ...

随机推荐

  1. VC++代码转换为QT代码问题总结

    一边开发一边总结......  QQ937113547

  2. CAD把自定义实体,变成普通实体(com接口VB语言)

    主要用到函数说明: MxDrawXCustomEvent::MxDrawXCustomEntity::explode 把自定义实体,变成普通实体,详细说明如下: 参数 说明 LONGLONG lEnt ...

  3. CPU总线

    总线(Bus)是计算机各种功能部件之间传送信息的公共通信干线,它是由导线组成的传输线束.按照计算机所传输的信息种类,计算机的总线可以划分为数据总线.地址总线和控制总线,分别用来传输数据.数据地址和控制 ...

  4. svn无法显示日期和作者

    当遇到这种情况,只要把这个read改为none就可以显示了  亲测绝对管用

  5. 数组--P1980 计数问题

    题目描述 题解 试计算在区间 1 到 n的所有整数中,数字 x(0 ≤ x ≤ 9)共出现了多少次?例如,在 1到 11中,即在 1,2,3,4,5,6,7,8,9,10,11 中,数字 1 出现了 ...

  6. Fleecing the Raffle(NCPC 2016 暴力求解)

    题目: A tremendously exciting raffle is being held, with some tremendously exciting prizes being given ...

  7. 在Java中调用带参数的存储过程

    JDBC调用存储过程: CallableStatement 在Java里面调用存储过程,写法那是相当的固定: Class.forName(.... Connection conn = DriverMa ...

  8. Git安装使用指南

    Git安装使用指南 Git原理示意图 1. 安装git Linux服务器版本为Redhat6.2-64,其他版本可能有些许不同 1.1 安装依赖包 在安装git前首先安装依赖包,包括的依赖包有: cv ...

  9. idea+maven配置log4j详解

    经过上一篇的讲解,知道了实现log4j打印日志依赖的jar包共3个,在pom.xml中加入相关依赖: <!-- 添加log4j日志相关jar包:共3个jar--> <!-- http ...

  10. TestNG设置测试用例执行优先级

    @Test(priority = x)设置测试用例执行优先级.x默认为0,0的优先级最高,0>1>2>3... import org.testng.annotations.Test; ...