div+css 居中布局
2015-08-21 09:25
579 查看
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />
<title></title>
</head>
<body style="height:100%;background:#FFFBE8;">
<div style="width:50%;height:50%;display:table; position:fixed;top:50%;left:50%;">
<div style="width:100%;height:100%;position:relative; font-family: Arial, Helvetica, sans-serif; display:table-cell; left:-50%;top:-50%;border:10px solid #f3e9c6; vertical-align:middle;background-color: #FFFBE8;text-align:center;">
<div>
<input name="" type="text"> </div>
<div>
<br>
<input name="" type="text"> </div>
</div>
</div>
</body>
</html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />
<title></title>
</head>
<body style="height:100%;background:#FFFBE8;">
<div style="width:50%;height:50%;display:table; position:fixed;top:50%;left:50%;">
<div style="width:100%;height:100%;position:relative; font-family: Arial, Helvetica, sans-serif; display:table-cell; left:-50%;top:-50%;border:10px solid #f3e9c6; vertical-align:middle;background-color: #FFFBE8;text-align:center;">
<div>
<input name="" type="text"> </div>
<div>
<br>
<input name="" type="text"> </div>
</div>
</div>
</body>
</html>
相关文章推荐
- CSS盒子模型
- 用Emmet写CSS3属性会自动添加前缀
- CSS:重量和级联规则,确定其优先级
- Html和CSS的关系
- 一些简单的css和js知识
- Qt中设置widget背景颜色/图片的注意事项(使用样式表 setStyleSheet())
- CSS基础知识整理二
- css 浮动和绝对定位的区别
- CSS--利用CSS实现一个简易的二级菜单(仿京东)
- 纯CSS3代码实现表格奇偶行异色,鼠标悬浮变色
- CSS中列表样式的简介
- Web前端从入门到精通-9 css简介——盒模型1
- css基础精华05
- css基础精华04
- css基础精华03
- css基础精华02
- float是什么?浮动在CSS中的作用
- Css fixed和absolute定位区别
- drupal_get_css -- drupal
- CSS3属性