语义UI - 表 - 中心对齐

Question

为什么中心对齐不起作用？

当我为我的元素指定类"center aligned"时，我期望文本居中对齐，但事实并非如此。

但是，如果我在所有元素上指定相同的类，那么它可以工作。

如果指定了一个类并且所有子级继承了，那么它是否足够？

小提琴在http://jsfiddle.net/4woemsjt/4/

Basically this one does not work.

<div class="ui grid centered">
    <div class="fourteen wide column">
      <table class="ui celled collapsing table">
        <thead>
        <tr class="center aligned">
          <th class="three wide">S1</th>
          <th class="three wide">S2</th>
          <th class="two wide">S3</th>   
        </tr>
        </thead>
        <tbody>
        <tr>                  
        <td>1</td>
        <td>2</td>
        <td>3</td>
        </tr>
        </tbody>
      </table>
    </div>
</div>    

但是这个确实

<div class="ui grid centered">
    <div class="fourteen wide column">
      <table class="ui celled collapsing table">
        <thead>
        <tr>
          <th class="center aligned three wide">S1</th>
          <th class="center aligned three wide">S2</th>
          <th class="center aligned two wide">S3</th>   
        </tr>
        </thead>
        <tbody>
        <tr>                  
        <td>1</td>
        <td>2</td>
        <td>3</td>
        </tr>
        </tbody>
      </table>
    </div>
</div>    

Answer 1

你需要为所有th元素添加“居中对齐”。

“。ui.table thead th”将“text-align：left”设置为.css文件中的默认值。