HTML 中的 valign 与文本对齐
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/8757170/
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
valign vs text-align in HTML
提问by sandbox
I can't figure out the difference between valign vs text-align in HTML in context with the following code:
我无法通过以下代码在上下文中弄清楚 HTML 中的 valign 与 text-align 之间的区别：
<table width="500" border="0">
<tr>
<td colspan="2" style="background-color:#FFA500;">
<h1>Main Title of Web Page</h1>
</td>
</tr>
<tr valign="top">
<td style="background-color:#FFD700;width:100px;text-align:top;">
<b>Menu</b><br />
HTML<br />
CSS<br />
JavaScript
</td>
<td style="background-color:#EEEEEE;height:200px;width:400px;text-align:top;">
Content goes here</td>
</tr>
<tr>
<td colspan="2" style="background-color:#FFA500;text-align:center;">
Copyright ? 2012</td>
</tr>
</table>
回答by jenson-button-event
valign(html attribute) is equivalent of vertical-alignin css
valign(html 属性) 相当于vertical-align在 css
align(html attribute) is equivalent of text-alignin css
align(html 属性) 相当于text-align在 css
html attribute versions are deprecated in favour of css
不推荐使用 html 属性版本以支持 css
vertical-alignpositions block elements (e.g. div) vertically inside other block elements
vertical-align将块元素（例如div）垂直放置在其他块元素内部
text-alignpositions inline elements (e.g. span, default text) inside block elements horizontally
text-align将行内元素（例如span，默认文本）水平放置在块元素内
回答by craniumonempty
The proper values for text-align are left|right|center|justify as it is horizontal, while the valign is vertical so it's top|middle|bottom|baseline. You can also use inherit on both.
text-align 的正确值是 left|right|center|justify，因为它是水平的，而 valign 是垂直的，所以它是 top|middle|bottom|baseline。您也可以在两者上使用继承。
Plus, text-align is css while valign is an html attribute. I think align is the html equivalent to text-align, while vertical-align is equivalent to valign.
另外， text-align 是 css 而 valign 是 html 属性。我认为 align 是相当于 text-align 的 html，而 vertical-align 相当于 valign。
http://www.w3schools.com/cssref/pr_text_text-align.asp
http://www.w3schools.com/cssref/pr_text_text-align.asp
http://www.w3schools.com/tags/att_td_valign.asp
http://www.w3schools.com/tags/att_td_valign.asp
If you switch text-align to "bottom", you'll notice it doesn't move as bottom isn't valid for text-align. The default (i think) is top. If you put "vertical-align:bottom" though, it will go to the bottom.
如果将 text-align 切换为“bottom”，您会注意到它不会移动，因为底部对 text-align 无效。默认（我认为）是顶部。但是，如果您输入“vertical-align:bottom”，它将移到底部。
A simple web search will find you these answers...
一个简单的网络搜索就会找到这些答案......
回答by Rolice
The text-alignis for horizontal aligning in CSS and styles, where vertical-alignis for vertical alignment. Then we have align="center"valign="top"are the correspondant attributes in the HTML for the same purpose.
该text-align是对CSS和风格横心，哪里vertical-align是垂直对齐。然后我们有align="center"valign="top"HTML 中的对应属性，用于相同的目的。
Read more about HTMLand CSS, this is my suggestion.
阅读有关HTML和CSS 的更多信息，这是我的建议。
回答by Brissles
valign will vertically align all elements, whereas text-align is specifically for text.
valign 将垂直对齐所有元素，而 text-align 专门用于文本。
回答by Gabriele Petrioli
A value of topfor text-alignis not supported (only left | center | right | justify | start | end).. so it does not do what you expect it ...
不支持topfor的值text-align（仅left | center | right | justify | start | end）.. 所以它不会做你期望的......
The text-alignMDN docsproperty is for horizontal align.
该text-alignMDN文档属性是水平对齐。
The vertical align you witness in your example is because of the valign="top"property of the trelement.
您在示例中看到的垂直对齐是因为元素的valign="top"属性tr。
Look at your example without the valignat http://jsfiddle.net/gaby/PvtAU/and you will notice this.
看看没有你的例子valign在http://jsfiddle.net/gaby/PvtAU/，你会发现这一点。
valignis only valid for trMDN docsand tdMDN docselements, and is deprecated in html 4.01 and obsolete in html5.
Use vertical-alignMDN docsinstead..
valign仅对trMDN 文档和tdMDN 文档元素有效，在 html 4.01 中已弃用，在 html5 中已过时。
使用vertical-alignMDN 文档代替..
回答by BrettAdamsGA
The value of text-align: top;is not valid css, text-alignis horizontal not vertical. This is where valign="top"comes into play. Putting in valign="left"is not valid the same as text-align: top;is not valid. valignis vertical.
的值text-align: top;是无效的 css，text-align是水平而不是垂直。这就是valign="top"发挥作用的地方。放入valign="left"无效与无效相同text-align: top;。valign是垂直的。
