div上下左右居中老调重弹

以前所有的针对IE6的操作方法就不再提了,因为6已经离我们远去了。

废话不多说,直接上代码。只需要记住这一种就可以了。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
  <head>
  <title>div左右以及上下(垂直)居中</title>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  <style type="text/css">
body { font-size: 12px; font-family: tahoma; }
div#wrap { border: 1px solid #FF0099; background-color: #FFCCFF; width: 700px; height: 400px; position: absolute; top: 50%; left: 50%; margin: -200px 0 0 -350px; }
</style>
  </head>
 <body>
  <div id="wrap"> </div>
</body>
</html>

在整个浏览器body中效果展示:

posted @ 2016-04-19 21:17  WebEye  阅读(153)  评论(0编辑  收藏  举报