在做登陆页面的话，需要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. arduino 红外遥控器控制LED灯

    /* 日期:2016.9.1 功能:红外遥控器控制LED灯 开,关,闪烁,呼吸 元件: 跳线公公头 * 5 led 220欧电阻 红外接收管,红外遥控 接线: 红外灯面向自己从左到右分别接 IO3 , ...

  2. Linux内核调试方法总结【转】

    转自:http://my.oschina.net/fgq611/blog/113249 内核开发比用户空间开发更难的一个因素就是内核调试艰难.内核错误往往会导致系统宕机,很难保留出错时的现场.调试内核 ...

  3. Redis 安装与简单示例 01_转

    一.Redis的安装 Redis下载地址如下:https://github.com/dmajkic/redis/downloads 解压后根据自己机器的实际情况选择32位或者64位.下载解压后图片如下 ...

  4. MySQL重置root用户密码的方法

    本教程适用于采用Win2003.WinXP操作系统的迅美VPS和云主机产品. 当管理员忘记MySQL密码怎么办?屡次输入密码,仍然提示错误,网站无法正常运行,数据库也无法管理,管理员束手无策. 网站程 ...

  5. NSDictionary to jsonString || 对象转json格式

    -(NSString*)DataTOjsonString:(id)object { NSString *jsonString = nil; NSError *error; NSData *jsonDa ...

  6. 新学习的语言Groovy

    什么是 Groovy? Groovy 是 JVM 的一个替代语言 —替代 是指可以用 Groovy 在 Java 平台上进行 Java 编程,使用方式基本与使用 Java 代码的方式相同.在编写新应用 ...

  7. [HTML]POST方法和GET方法

    GET方法: function btn_get_click(){ var httpRequest = new XMLHttpRequest(); httpRequest.onreadystatecha ...

  8. html的textarea控制字数小案例

    <h3>设计理念说明(200字以内)</h3> <textarea onkeyup="checkLen(this)"></textarea ...

  9. c#之线程池

    using System; using System.Collections.Generic; using System.Linq; using System.Text; using System.I ...

  10. winform——绑定DataGridView

    ==========================================================================================重点需要掌握==Au ...