div垂直居中的几种办法

最新推荐文章于 2023-09-11 18:44:00 发布

iteye_20068

最新推荐文章于 2023-09-11 18:44:00 发布

阅读量124

点赞数

分类专栏： Web开发文章标签： CSS IE Blog HTML

Web开发专栏收录该内容

1 篇文章 0 订阅

订阅专栏

以前看到dlee讲过，将line-height设置为与DIV的高度相同就可以居中
[code]
<style type="text/css">

</style>

<div class="con_div">
测试内容ddddddddddd
</div>
[/code]

今天又在[url=http://blog.donews.com/dodo/archive/2007/06/20/1177832.aspx]这里[/url]看到的一种方法，使用了CSS的vertical-align属性?
[code]
<style type="text/css">

</style>

<div class="con_div">
<span class="fixie"></span>
测试内容
</div>
[/code]
再次看到[url="http://tech.idv2.com/2007/07/22/center-div-horizontally-and-vertically-with-css/"]一种[/url]


<style>
#warp {
  position: absolute;
  width:500px;
  height:200px;
  left:50%;
  top:50%;
  margin-left:-250px;
  margin-top:-100px;
  border: solid 3px red;
}
</style>
<body>
  <div id=warp>Test</div>
</body>