html表单居上对齐,HTML：如何居中对齐表单

11 个答案:

答案 0 :(得分：42)

@Lucius和@zyrolasting说得对。

但是，您可能需要为表单指定width才能使其正常工作。

form {

margin: 0 auto;

width:250px;

}

答案 1 :(得分：23)

只需将一些CSS放入样式表中就像这样

form {

text-align: center;

}

然后你就完成了！

答案 2 :(得分：17)

作为form块元素，您可以通过将其边距设置为auto来对齐它：

form { margin: 0 auto; }

修改强>

正如@moomoochoo正确指出的那样，只有在块元素(在本例中为您的表单)指定了特定宽度时，此规则才有效。

此外，这个“技巧”不适用于浮动元素。

答案 3 :(得分：3)

这将使字段占据宽度的50％，并正确居中和调整大小

{

width: 50%;

margin-left : 25%

}

也可以使用“ vw”(视图宽度)单位代替“％”

答案 4 :(得分：2)

使用center：

这只是一种方法，虽然它不是advised.

古代编辑：请不要这样做。我只是说它是存在的东西。

答案 5 :(得分：0)

#form{

position:fixed;

top:50%;

left:50%;

width:250px;

}

你可以调整top＆amp;取决于表格大小。

答案 6 :(得分：0)

只需将align =“ center”移至form标签

Search this website:

答案 7 :(得分：0)

试试这个：

通过以下方式将表单宽度设置为20％：

state:([\w\s]+)\s

现在，如果整个画布是100％，则中心为50％。因此，为了使形状的中心在中心对齐，50-(20/2)= 40。

因此，将左边距设为40％：

width : 20%;

答案 8 :(得分：0)

最后两行对于对齐中心很重要：

.f01 {

background-color: rgb(16, 216, 252);

padding: 100px;

text-align: left;

margin: auto;

display: table;

}

答案 9 :(得分：-1)

简单方法：在表单标记之前添加“center”标记

答案 10 :(得分：-1)

在大多数情况下都有效，例如上面提到的Wobbuffet ......