在做登陆页面的话，需要login的div 上下左右都居中。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"

"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="gb2312" >

<head>

<title>居中Demo</title>

</head>  

<mce:style type="text/css" title="currentStyle" media="screen">

<!--

#divcenter{

   position:absolute;/*层漂浮*/

   top:50%;

   left:50%;

   width:300px;

   height:300px;

   margin-top:-150px;/*注意这里必须是DIV高度的一半*/

   margin-left:-150px;/*这里是DIV宽度的一半*/

   background:yellow;

   border:1px solid red;

}

-->

</mce:style>

<style type="text/css" title="currentStyle" media="screen" mce_bogus="1">

#divcenter{

   position:absolute;/*层漂浮*/

   top:50%;

   left:50%;

   width:300px;

   height:300px;

   margin-top:-150px;/*注意这里必须是DIV高度的一半*/

   margin-left:-150px;/*这里是DIV宽度的一半*/

   background:yellow;

   border:1px solid red;

}

</style>

</head>

<body>

<div id="divcenter">

this is a test

</div>

</body>

</html>

参考地址：http://blog.csdn.net/carlfan/article/details/4579590参考地址：

如何让div上下左右都居中的更多相关文章

  1. css+div上下左右自适应居中

    主要记录自己日常积累的布局相关的东西,持续更新中. 1.登录框上下左右自适应居中 以前想要把登录表单始终放置在页面的中间,花了不少心思,一直以来用的解决方法都是用js,感觉有点麻烦不是很好,于是在网上 ...

  2. html 上下左右都居中

    给要居中的图片或者链接所在的div 设置例如以下属性 width: px; height: wd=px&tn=44039180_cpr&fenlei=mv6quAkxTZn0IZRqI ...

  3. 小div在大div里面水平垂直都居中的实现方法

    关于如何设置小盒子在大盒子里面水平垂直方向同时居中的实现方法有很多种,下面仅列举了常用的几种. 首先看一下要实现的效果图及对应的html代码: <div class="parent&q ...

  4. 绝对定位上下左右都为0 margin为auto为什么能居中

    老规矩,先来一段废话,我大学刚入门的时候觉得CSS很简单,记一记就会了,不就是盒模型嘛,现在想来觉得自己那时候真的很自以为是哈哈.但是随着工作沉淀,我明白了任何技术都有着它的深度和广度,正是因为不少人 ...

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

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

  6. 使图片相对于上层DIV始终水平、垂直都居中

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

  7. 如何让图片相对于上层DIV始终保持水平、垂直都居中

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

  8. 如何将一个div盒子水平垂直都居中？

    html代码如下: 固定样式: 方法一:利用定位(常用方法,推荐) .parent{ position:relative; } .child{ position:absolute; top:50%; ...

  9. css3-7 如何让页面元素水平垂直都居中（元素定位要用css定位属性）

    css3-7 如何让页面元素水平垂直都居中(元素定位要用css定位属性) 一.总结 一句话总结:元素定位要用css定位属性,而且一般脱离文档流更加好操作.先设置为绝对定位,上左都50%,然后margi ...

随机推荐

  1. 数字转表格标题 Excel Sheet Column Title

    #include<string>using namespace std;class Solution {public:   string convertToTitle(int n) {  ...

  2. xtjh

    <div onkeydown="javascript:if(event.keyCode==13) search()"> <br > ISBN<span ...

  3. 20145227《Java程序设计》第2次实验报告

    20145227<Java程序设计>第2次实验报告 实验步骤与内容 一.实验内容 1. 初步掌握单元测试和TDD 2. 理解并掌握面向对象三要素:封装.继承.多态 3. 初步掌握UML建模 ...

  4. Oracle中左右外连接详解

    数据表的连接有:  1.内连接(自然连接): 只有两个表相匹配的行才能在结果集中出现 2.外连接: 包括 (1)左外连接(左边的表不加限制) (2)右外连接(右边的表不加限制) (3)全外连接(左右两 ...

  5. python：Xml

    <data> <country name="Liechtenstein"> <rank updated="yes">2< ...

  6. 每日一九度之 题目1038：Sum of Factorials

    时间限制:1 秒 内存限制:32 兆 特殊判题:否 提交:2109 解决:901 题目描述: John von Neumann, b. Dec. 28, 1903, d. Feb. 8, 1957, ...

  7. 基本的MFC多线程

    多线程程序我本来是能够来写的.但是由于在图像处理的过程中,对于这方面知识使用的比较少,造成重复忘记的情况.这里再次进行整理学习,特别注重和“图像处理”理清关系,为下一步使用奠定基础. 这里实现的是工作 ...

  8. linux下网络程序遭遇SIGPIPE的解决（转）

    http://blog.chinaunix.net/uid-20135786-id-3409085.html 问题描述: 我的一个服务器程序, 在Windows下运行正常. 但当在Linux(cent ...

  9. reactor模式学习

    一.介绍reactor模式 二.使用reactor模式 三.参考 http://blog.csdn.net/swordmanwk/article/details/6170995  该文章,简单介绍了r ...

  10. shell 条件判断参数

    -b file 若文件存在且是一个块特殊文件,则为真 -c file 若文件存在且是一个字符特殊文件,则为真 -d file 若文件存在且是一个目录,则为真 -e file 若文件存在,则为真 -f ...