Chinaunix首页 | 论坛 | 博客

Web world

首页　| 　博文目录　| 　关于我

cici0208

  • 博客访问： 485939
  • 博文数量： 226
  • 博客积分： 0
  • 博客等级： 民兵
  • 技术积分： 2111
  • 用 户 组： 普通用户
  • 注册时间： 2014-06-20 09:02
个人简介

web web web

文章分类

全部博文（226）

文章存档

2020年（2）

2019年（1）

2018年（3）

2017年（26）

2016年（57）

2015年（60）

2014年（77）

我的朋友
最近访客
推荐博文
垂直居中布局

分类： Html/Css

2016-06-21 15:07:44


  1. <html>
  2. <head>
  3. <title>垂直居中</title>
  4. <meta charset="utf-8">
  5. <style type="text/css">
  6. *{
  7.     margin: 0;
  8.     padding: 0;
  9. }
  10. .container {
  11.     width: 612px;
  12.     margin: 10px auto;
  13.     background: green;
  14.     height: 300px;
  15.     left: 50%;
  16.     top: 50%;
  17.     position: absolute;
  18.     margin-left: -356px;
  19.     margin-top: -150px;
  20. }
  21. </style>
  22. </head>
  23. <body>
  24. <div class="container">
  25.     垂直居中，使用:<br>
  26.     width: 612px;<br>
  27.     margin: 10px auto;<br>
  28.     background: red;<br>
  29.     height: 300px;<br>
  30.     left: 50%;<br>
  31.     top: 50%;<br>
  32.     position: absolute;<br>
  33.     margin-left: -356px;<br>
  34.     margin-top: -150px;<br>
  35. </div>
  36. </body>
  37. </html>

阅读(531) | 评论(0) | 转发(0) |
0

上一篇：z-index详解

下一篇：移动设备尺寸规范汇总

给主人留下些什么吧！~~
关于我们 | 关于IT168 | 联系方式 | 广告合作 | 法律声明 | 免费注册

Copyright 2001-2010 ChinaUnix.net All Rights Reserved 北京皓辰网域网络信息技术有限公司. 版权所有

感谢所有关心和支持过ChinaUnix的朋友们

16024965号-6