转自: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. 从整体上理解进程创建、可执行文件的加载和进程执行进程切换,重点理解分析fork、execve和进程切换

    学号后三位<168> 原创作品转载请注明出处https://github.com/mengning/linuxkernel/ 1.分析fork函数对应的内核处理过程sys_clone,理解 ...

  2. mybatis 使用参数

    Parameter  1.   传入简单类型 JAVA代码: public User get(Long id) { return (User) getSqlSession().selectOne(&q ...

  3. Android 按钮常用点击事件大总结

    很多学习Android程序设计的人都会发现每个人对代码的写法都有不同的偏好,比较明显的就是对控件响应事件的写法的不同.因此本文就把这些写法总结一下,比较下各种写法的优劣,希望对大家灵活地选择编码方式可 ...

  4. 十二届 - CSU 1803 :2016(同余定理)

    题目地址:http://acm.csu.edu.cn/csuoj/problemset/problem?pid=1803 Knowledge Point: 同余定理:两个整数a.b,若它们除以整数m所 ...

  5. 透彻分析C/C++中memset函数

    在C语言中,经常需要对内存进行操作,里面涉及很多函数,但是memset函数的使用有一点需要大家格外注意,这也是我在做项目时遇到过的一个问题,调试了很久才找出来错误. 函数原型是:void *memse ...

  6. JQurey---新尝试

    <%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding= ...

  7. 集合类(Collection和Map接口)简介

    集合分为Collection和Map,详细分类如下图所示: 以下是测试验证代码: //HashSet,无序(存取不一致).去重 Set set_H = new HashSet(); set_H.add ...

  8. Reading Lists

    * Non-academic 1. Slowing Down to the Speed of Life, by Richard Carlson and Joseph Bailey.2. Your Mo ...

  9. AC自动机模板浅讲

    Description 给你N个单词,然后给定一个字符串,问一共有多少单词在这个字符串中出现过(输入相同的字符串算不同的单词,同一个单词重复出现只计一次). Input 第一行一个整数N,表示给定单词 ...

  10. [bzoj3809]Gty的二逼妹子序列_莫队_分块

    Gty的二逼妹子序列 bzoj-3809 题目大意:给定一个n个正整数的序列,m次询问.每次询问一个区间$l_i$到$r_i$中,权值在$a_i$到$b_i$之间的数有多少个. 注释:$1\le n\ ...