Question

我的网页表单非常简单。它必须有三行text / ASP.NET元素。 Master页面有一个页眉和一个页脚。我需要将这三行放在页面中间的垂直和水平中心，特别是如果底部发生变化。我如何使用CSS？

Answer 1

在您的母版页中，您需要一个容器和中心，然后您需要一个div作为主要内容。原始代码类似于：

<div id="center">
   <div id="main">
      <p>This text is perfectly vertically and horizontally centered.</p>
   </div><!-- end #main -->
</div><!-- end #center -->

<style>
   #center { position: absolute; top: 50%; width: 100%; height: 1px; overflow: visible }
   #main { position: absolute; left: 50%; width: 720px; margin-left: -360px; height: 540px; top: -270px } 
</style>

这是使用Damien提供的相同方法。它往往是单独使用CSS完成的唯一方法。您可以使用JavaScript / jQuery更好地解决这个问题。

Answer 2

水平对齐事物很简单。如果元素有一个固定的，给它下面的css：

.element
{
      margin: 0 auto;
}

这告诉元素有0个顶部和底部马林并自动计算左右边距。

有一种方法可以垂直居中称为dead center的元素。它使用页面顶部50％的偏移和负边距将内容（垂直）带到中心。缺点是您的元素需要具有固定的大小（高度和宽度）。

Answer 3

这对我有用：

<style type="text/css">
  .auto-style1 {text-align:center;}
</style>

ASP.NET + CSS - 如何将网页中间的元素垂直和水平居中？

3 个答案: