HTML 中的 valign 与 text-align
我无法通过以下代码找出 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>
I can't figure out the difference between valign vs text-align in HTML in context with the following code:
<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>
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（6）
valign（html属性）相当于css中的vertical-alignalign（html属性）相当于text-alignhtml 属性版本已弃用，取而代之的是 css
vertical-align将块元素（例如div）垂直放置在其他块元素内< code>text-align 定位内联元素（例如
span，默认文本）水平位于块元素内valign(html attribute) is equivalent ofvertical-alignin cssalign(html attribute) is equivalent oftext-alignin csshtml attribute versions are deprecated in favour of css
vertical-alignpositions block elements (e.g.div) vertically inside other block elementstext-alignpositions inline elements (e.g.span, default text) inside block elements horizontallytext-align 的正确值是 left|right|center|justify，因为它是水平的，而 valign 是垂直的，所以它是 top|middle|bottom|baseline。您还可以对两者使用继承。
另外，text-align 是 css，而 valign 是 html 属性。我认为align是html相当于text-align，而vertical-align相当于valign。
http://www.w3schools.com/cssref/pr_text_text-align.asp
http://www.w3schools.com/tags/att_td_valign.asp
如果您将文本对齐切换为“底部”，您会发现它不会移动，因为底部没有移动对于文本对齐有效。默认（我认为）是顶部。如果你输入“vertical-align:bottom”，它将到达底部。
只需进行简单的网络搜索即可找到这些答案...
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.
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.
http://www.w3schools.com/cssref/pr_text_text-align.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.
A simple web search will find you these answers...
text-align用于 CSS 和样式中的水平对齐，其中vertical-align用于垂直对齐。然后我们有align="center"valign="top"是 HTML 中用于相同目的的相应属性。详细了解 HTML 和 CSS，这是我的建议。
The
text-alignis for horizontal aligning in CSS and styles, wherevertical-alignis for vertical alignment. Then we havealign="center"valign="top"are the correspondant attributes in the HTML for the same purpose.Read more about HTML and CSS, this is my suggestion.
valign 会垂直对齐所有元素，而 text-align 专门针对文本。
valign will vertically align all elements, whereas text-align is specifically for text.
不支持
text-align的top值（仅left | center | right | justify | start | end）..所以它不会做你期望的事情...文本对齐MDN docs 属性用于水平对齐。您在示例中看到的垂直对齐是由于
tr元素的valign="top"属性造成的。在 http://jsfiddle.net/gaby/PvtAU 查看没有
valign的示例/ 你会注意到这一点。valign仅对tr有效 < super>MDN 文档 和tdMDN docs 元素，在 html 4.01 中已弃用，在 html5 中已过时。使用
vertical-alignMDN 文档< /a> 相反..A value of
topfortext-alignis not supported (onlyleft | center | right | justify | start | end).. so it does not do what you expect it ...The
text-alignMDN docs property is for horizontal align.The vertical align you witness in your example is because of the
valign="top"property of thetrelement.Look at your example without the
valignat http://jsfiddle.net/gaby/PvtAU/ and you will notice this.valignis only valid fortrMDN docs andtdMDN docs elements, and is deprecated in html 4.01 and obsolete in html5.Use
vertical-alignMDN docs instead..text-align: top;的值不是有效的 css，text-align是水平的而不是垂直的。这就是valign="top"发挥作用的地方。输入valign="left"无效，与text-align: top;无效相同。valign是垂直的。The value of
text-align: top;is not valid css,text-alignis horizontal not vertical. This is wherevalign="top"comes into play. Putting invalign="left"is not valid the same astext-align: top;is not valid.valignis vertical.