如何让div上下左右都居中
在做登陆页面的话,需要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上下左右都居中的更多相关文章
- css+div上下左右自适应居中
主要记录自己日常积累的布局相关的东西,持续更新中. 1.登录框上下左右自适应居中 以前想要把登录表单始终放置在页面的中间,花了不少心思,一直以来用的解决方法都是用js,感觉有点麻烦不是很好,于是在网上 ...
- html 上下左右都居中
给要居中的图片或者链接所在的div 设置例如以下属性 width: px; height: wd=px&tn=44039180_cpr&fenlei=mv6quAkxTZn0IZRqI ...
- 小div在大div里面水平垂直都居中的实现方法
关于如何设置小盒子在大盒子里面水平垂直方向同时居中的实现方法有很多种,下面仅列举了常用的几种. 首先看一下要实现的效果图及对应的html代码: <div class="parent&q ...
- 绝对定位上下左右都为0 margin为auto为什么能居中
老规矩,先来一段废话,我大学刚入门的时候觉得CSS很简单,记一记就会了,不就是盒模型嘛,现在想来觉得自己那时候真的很自以为是哈哈.但是随着工作沉淀,我明白了任何技术都有着它的深度和广度,正是因为不少人 ...
- 用CSS让DIV上下左右居中的方法
转载自喜欢JS的无名小站 例如 一个父div(w:100%;h:400px)中有一个子div(w:100px;100px;).让其上下左右居中. 方法一(varticle-align) 理念 利用表格 ...
- 使图片相对于上层DIV始终水平、垂直都居中
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- 如何让图片相对于上层DIV始终保持水平、垂直都居中
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- 如何将一个div盒子水平垂直都居中?
html代码如下: 固定样式: 方法一:利用定位(常用方法,推荐) .parent{ position:relative; } .child{ position:absolute; top:50%; ...
- css3-7 如何让页面元素水平垂直都居中(元素定位要用css定位属性)
css3-7 如何让页面元素水平垂直都居中(元素定位要用css定位属性) 一.总结 一句话总结:元素定位要用css定位属性,而且一般脱离文档流更加好操作.先设置为绝对定位,上左都50%,然后margi ...
随机推荐
- c/c++ 常用的几个安全函数
_stprintf_s // 格式化字符串 _vsntprintf_s // 格式化 不定长参数用到
- datatables条件判断列显示还是隐藏
定义一个状态变量status根据条件取值true或者false,然后在datatables参数设置中相应的columns属性的data后面加上"visible":status,该列 ...
- init_MUTEX 与 sema_init 函数【转】
转自:http://blog.chinaunix.net/uid-7332782-id-3211627.html 在编译Linux设备驱动程序学习(1)-字符设备驱动程序中scull.c程序时,报错: ...
- 数字转表格标题 Excel Sheet Column Title
#include<string>using namespace std;class Solution {public: string convertToTitle(int n) { ...
- rsync的断点续传设置。
关于rsync的断点续传 关于rsync的断点续传 经常copy大文件,由于服务器.路由等网络的不确定性,老是出现 remote server not responding.于是查了下资料,发现rsy ...
- JavaScript中统计Textarea字数并提示还能输入的字符
<span style="font-size:18px;"><script language="javascript"> functio ...
- IOS5基础教程之一-----如何创建XCode项目
一.IOS的基础知识 1.只有一个应用程序正在运行.在IOS上,每一段时间内只能激活一个应用程序并在屏幕上显示. 2.只有一个窗口.只允许应用程序操作的一个窗口. 3.访问受限.只能在IOS为应用程序 ...
- ACM题目————STL练习之字符串替换
描述 编写一个程序实现将字符串中的所有"you"替换成"we" 输入 输入包含多行数据 每行数据是一个字符串,长度不超过1000 数据以EOF结束 输出 对于输 ...
- 两句话概括“sql外键”
外键的使用就是: 1.外键表可以删除,外键表删完了 才能删主键表2.添加的时候不能添加在主键没有的内容
- 为开发者准备的9个实用PHP代码片段
一.查看邮件是否已被阅读 当你发送邮件时,你肯定很想知道你的邮件是否已被对方查看.下面的代码就能实现记录阅读你邮件的IP地址,还有实际的阅读日期和时间. error_reporting(0);Head ...