对齐表格标题中的文本 [英] Align text in a table header

问题描述

似乎 align 不适用于 th 元素。这是我的HTML：

< div style =width：100％ ; height：175px; overflow：auto;> < table class =gridid =table> < THEAD> < TR> < th class =not_mapped_stylestyle =display：none;对齐= 中心 > ID< /第> < th class =not_mapped_stylealign =center> DisplayName< / th> < th align =center> PrimaryEmail< / th> < th align =center>年龄< / th> < th align =center>电话< / th> < / TR> < / THEAD> <字幕>联系和LT; /字幕> < TBODY> < TR> < td style =display：none; property_value =0property_name =idalign =center> 0< / td> < td property_value =rpcuserproperty_name =DisplayNamealign =center> rpcuser< / td> < td property_value =[e-mail]_name =PrimaryEmailalign =center> [e-mail]< / td> < td property_value =69property_name =Agealign =center> 69< / td> < td property_value =+ 722616807property_name =Hand_Phonealign =center> + 18007< / td> < / TR> < / tbody的> < / table>< / div>

对 td 元素工作得很好，但对 th 失败。为什么？

解决方案

请尝试：

  text-align：center; 
  

您可能熟悉HTML对齐属性（自HTML 5起已停止使用）。 align属性可以与标签一起使用，例如

 < table>，< td>和< img> 
  

来指定这些元素的对齐方式。该属性允许您水平对齐元素。 HTML还具有用于垂直对齐元素的valign属性。这也已经从HTML5中止。

这些属性不再支持使用CSS设置HTML元素的对齐方式。

实际上并没有CSS对齐或CSS valign属性。相反，CSS具有适用于块级元素的内联内容的文本对齐和适用于内联级别和表格单元的vertical-align属性。

It seems align is not working for the th element. Here is my HTML:

<div style="width: 100%; height: 175px; overflow: auto;">
  <table class="grid" id="table">
    <thead>
      <tr>
        <th class="not_mapped_style" style="display: none;" align="center">id</th>
        <th class="not_mapped_style" align="center">DisplayName</th>
        <th align="center">PrimaryEmail</th>
        <th align="center">Age</th>
        <th align="center">Phone</th>
      </tr>
    </thead>
    <caption>Contacts</caption>
    <tbody>
      <tr>
        <td style="display: none;" property_value="0" property_name="id" align="center">0</td>
        <td property_value="rpcuser" property_name="DisplayName" align="center">rpcuser</td>
        <td property_value="[e-mail]" property_name="PrimaryEmail" align="center">[e-mail]</td>
        <td property_value="69" property_name="Age" align="center">69</td>
        <td property_value="[phone]" property_name="Hand_Phone" align="center">+18007</td>
      </tr>
    </tbody>
  </table>
</div>

Text aligning is working just fine for the td elements but fails for the th. Why?

解决方案

Try:

text-align: center;

You may be familiar with the HTML align attribute (which has been discontinued as of HTML 5). The align attribute could be used with tags such as

<table>, <td>, and <img> 

to specify the alignment of these elements. This attribute allowed you to align elements horizontally. HTML also has/had a valign attribute for aligning elements vertically. This has also been discontinued from HTML5.

These attributes were discontinued in favor of using CSS to set the alignment of HTML elements.

There isn't actually a CSS align or CSS valign property. Instead, CSS has the text-align which applies to inline content of block-level elements, and vertical-align property which applies to inline level and table cells.

这篇关于对齐表格标题中的文本的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！