我有以下HTML代码,并希望居中对齐我的表单。HTML:如何居中对齐表格
<form action="advsearcher.php" method="get">
Search this website:<input align="center" type="text" name="search" />
<input type="submit" value="Search"/>
</form>
我该怎么做?提前Thanx。
我有以下HTML代码,并希望居中对齐我的表单。HTML:如何居中对齐表格
<form action="advsearcher.php" method="get">
Search this website:<input align="center" type="text" name="search" />
<input type="submit" value="Search"/>
</form>
我该怎么做?提前Thanx。
作为form
块元素,你可以通过它的侧边设置为自动中心对齐:
form { margin: 0 auto; }
编辑:
作为@moomoochoo正确地指出,这条规则将只工作,如果块元素(您的表单,在这种情况下)已被分配了特定的宽度。
另外,这个'技巧'不适用于浮动元素。
@Lucius和@zyrolasting说得对。
但是,您可能需要将表格指定为width
才能正常工作。
form {
margin: 0 auto;
width:250px;
}
只是把一些CSS到样式表这样
form {
text-align: center;
}
然后就大功告成了!
@JohannBehrens:为什么它不好呢? – favq 2013-12-11 15:49:56
@anonymous:您将希望通过在.html文件中使用仅HTML和.css文件中的ONLY CSS来将语义和设计相互分离。使您的代码清晰,结构合理,可供其他开发人员或设计人员阅读,并具有前瞻性,并且我可以继续更长时间。 – 2013-12-13 12:21:24
text-align:中心的作品。只需在一个css文件中使用它,一切都很好。您也可以在HTML中使用
#form{
position:fixed;
top:50%;
left:50%;
width:250px;
}
您可以调整顶部&取决于窗体大小离开。
<center><form></form></center>
确实在大多数情况下,像在Wobbuffet工作上面提到的...
-1'
简单的方法:表单标签
Centre已弃用。 – 2016-12-12 12:45:54
前添加一个“中心”标签试试这个: 设置的宽度表格为20%:
width : 20%;
现在如果整个画布为100%,则中心为50%。因此,要对齐窗体的中心在中心,50-(20/2)= 40。 因此设置你的左边距为40%,通过这样做:
left : 40%;
你是对的。我说了理所当然。我的错! – Lucius 2012-03-16 12:53:54
谢谢......加入'auto'做了诀窍 – user602599 2013-08-12 18:00:10