HTML 中心输入按钮
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/10793604/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
HTML center input buttons
提问by user1383147
Here is my code:
这是我的代码:
<p align="center">Do you want to play the game?</p><br>
<Input type = 'Submit' Name ='StartQuiz' value="Yes" align="center">
<Input type = 'Submit' Name ='LogOut' value="No" align="center">
The buttons are not in the center. Do I have to use CSS for this? I read on the net to just use the simple align tag.
按钮不在中间。我必须为此使用 CSS 吗?我在网上阅读只是使用简单的对齐标签。
How should I go about aligning these buttons to the center?
我应该如何将这些按钮与中心对齐?
回答by Fiambre
Align is deprecated on HTML5, so considered use CSS3 instead. The align attributte is to center the content and not the element itself.
HTML5 不推荐使用 Align,因此考虑使用 CSS3。align 属性是使内容居中,而不是元素本身。
The input element is inline-block by default, so, to center you need to put them inside a div as here:
默认情况下,输入元素是内联块,因此,要居中,您需要将它们放在 div 中,如下所示:
<div style="text-align:center;">
<input type="text" />
</div>
This is cause the inline-block elements share the same line with other elements and you need to center all elements that share the same line. The div element is a block element that display alone in one line.
这是因为 inline-block 元素与其他元素共享同一行,您需要将共享同一行的所有元素居中。div 元素是一个单独显示在一行中的块元素。
So you have another option to center an input, and you can set to "display:block;" as here:
所以你有另一个选项来居中输入,你可以设置为“display:block;” 如这里:
<input type="text" style="margin:0px auto; display:block;" />
回答by MusikAnimal
You should be using CSS for such styling. Rid of the HTML align attributes, add a wrapper, and center the text. Also note that the <center>
tag and certain uses of align=center
are deprecated as of HTML5.
您应该将 CSS 用于此类样式。去掉 HTML 的对齐属性,添加一个包装器,并使文本居中。另请注意,从HTML5 开始<center>
,align=center
不推荐使用的标记和某些用途。
<div>
<p>Do you want to play the game?</p><br>
<input type="submit" name="StartQuiz" value="Yes">
<input type="submit" name="LogOut" value="No">
</div>
And for your CSS:
对于您的 CSS:
div
{
text-align: center;
}?
回答by Rohit Azad
Define one div parent and give to text-align center
in your css .
定义一个 div 父级并text-align center
在您的 css 中提供。
Hi Check to live demo http://jsfiddle.net/vdUEZ/
嗨检查现场演示http://jsfiddle.net/vdUEZ/
Remove p tag align center
and give to one div
删除p tag align center
并给一个 div
Updated Live demohttp://jsfiddle.net/vdUEZ/1/
回答by Exor
<p align="center">Do you want to play the game?</p><br>
<div style="text-align: center">
<Input type = 'Submit' Name ='StartQuiz' value="Yes" align="center">
<Input type = 'Submit' Name ='LogOut' value="No" align="center">
</div>
回答by Asaph
Your strategy should work if you move the <input>
tags inside the the <p>
tag and remove the deprecated align
attributes in the <input>
tags. Even if you were to use the align
attribute in an <input>
tag, the correct value would be "middle"
, not "center"
. Try this code:
如果您将<input>
标签移动到标签内<p>
并删除标签中已弃用的align
属性,则您的策略应该有效<input>
。即使您要align
在<input>
标签中使用该属性,正确的值也应该是"middle"
,而不是"center"
。试试这个代码:
<p align="center">Do you want to play the game?<br>
<Input type = 'Submit' Name ='StartQuiz' value="Yes">
<Input type = 'Submit' Name ='LogOut' value="No">
</p>
It's also possible (preferred, actually) to use CSS for centering.
也可以(实际上是首选)使用 CSS 进行居中。
回答by theliberalsurfer
chuck the inputs inside a <center>
tag. check out the live demo http://jsfiddle.net/xA2kS/
将输入夹在<center>
标签内。查看现场演示http://jsfiddle.net/xA2kS/