Question

我在正文中有表单。我正在尝试替换屏幕中间/中心的表单。在CSS中有没有正确的方法呢？

-----------------------
-                     -
-                     -
-                     -
-          M          -
-                     -
-                     -
-                     -
-----------------------

Answer 1

编辑:(剪切以前的代码，它只是水平对齐）

因为没有其他人回来关于垂直对齐......这是一个选项。如果表格只是坐在体内，你不需要包装等。基本解决方案（需要固定高度）：

 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
 "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
 <html>
 <head>
     <title>Vertical/Horizontal Align</title>
     <style type="text/css">
         form {
             height:400px;
             width:400px;
             position: absolute;
             left: 50%;
             top: 50%;
             background-color:#CCC;
             /* Set margins to offset 50% of the w/h */
             margin: -200px 0 0 -200px;
         }
     </style>
 </head>
 <body>
     <form action="/something">
         <p>
          <label>NAME: </label> <input type="text" name="Name" />
         </p>
         <p>
         <label>PHONE: </label> <input type="text" name="Phone" />
         </p>
     </form>
 </body>
 </html>

背景颜色只是为了说明宽度/高度..

Answer 2

声明表单的width属性并使用自动左边距，例如：

form{
   width: 50%;
   margin: 0 auto;
}

如何水平和垂直居中表格？

2 个答案: