如何使css内容像盒子，文本为中心？

Question

我刚开始使用css教程，所以我对css没什么了解。在这里我发布了css代码。你能告诉我如何在浏览器中制作整个内容。我还包括输出的屏幕截图......

body {
background:#E9E9E9;


}

#formWrap {
width:720px;
margin-top:30px;
margin-left:30px;
margin-right:30px;
background:#FFF;

border:1px solid #F1F1F1;
-moz-border-radius:20px;
-moz-box-shadow:2px 2px 5px #999;
-webkit-border-radius:20px;
-webkit-box-shadow:2px 2px 5px #999;
padding:16px 10px 40px;
}

#formWrap #form {
border-top: 1px solid #EEE;
width: auto;
}
#formWrap #form .row {
border-bottom: 1px dotted #EEE;
display: block;
line-height: 38px;
overflow: auto;
padding: 24px 0px;
width: 100%;
}
#formWrap #form .row .label {
font-size: 16px;
font-weight: bold;
font-family: Arial, Helvetica, sans-serif;
width: 180px;
padding-right: 10px;
margin-right: 10px;
}
#formWrap #form .row .input {
float: left;
margin-right: 10px;
font-style: italic;
width: auto;
}

.detail{
width: 260px;
font-family: Arial, Helvetica, sans-serif;
font-size: 20px;
padding: 7px 8px;
margin: 0;
}

.mess {
width: 450px;
height: 250px;
max-width: 450px;
overflow: auto;
font-family: Arial, Helvetica, sans-serif;
font-size: 20px;
padding: 7px 8px;
line-height: 1em;
margin: 0;
}

#formWrap #form .row .context {
color: #999;
font-size: 11px;
font-style: italic;
font-family: Arial, Helvetica, sans-serif;
width: 200px;
float: left;
}


#formWrap #form .submit {
font-family: Arial, Helvetica, sans-serif;
margin-top: 25px;

color: #000;
font-size: 16px;
text-shadow: 1px 1px 1px #999;

}

Answer 1

考虑到#formwrap是主要容器（白色和最外面的容器），只需要做 -

#formwrap{
    margin:0 auto;
}

Answer 2

您可以在要居中的元素上使用此行：

#formWrap {
    margin: 0 auto;
}

这样做是因为它将元素的顶部和底部magin设置为0，左右边距将是易燃的。以上就像在做

#formWrap {
   margin: 0 auto 0 auto;
}

参数为：右上角左下角。因此，如果您设置如上所示的顶部和右侧值，浏览器会将这些值提供给底部和左侧的masgins。如果您只设置一个值，如：

#formWrap {
   margin: 0;
}

然后所有四方都会获得这个价值。

但回到你的问题......你还必须确保包含你想要居中的那个元素的元素是你想要居中的全宽。如果不是，它将不会做任何事情。因为它将以其父元素为中心而不是例如与屏幕的关系。