风格标题标题基于列单元格类型

我有一个表格是用CSS类填充细胞字符串和货币。我希望字符串列的标题左对齐，并且货币列的标题右对齐。风格标题标题基于列单元格类型

有没有办法纯粹用CSS来做到这一点？

在下面的代码，所述字符串报头将被左对齐和货币头将是正确对准的，并且它应该通过检测类型在该列中的单元的知道这一点。

注意：单列（头下）中的所有单元格将共享相同的类类型。没有混合和匹配。

<table> 
    <thead> 
     <tr> 
      <th>Strings</th> 
      <th>Currency</th> 
     </tr> 
    </thead> 
    <tr> 
     <td class="string">This is a string.</td> 
     <td class="currency">100.00</td> 
    </tr> 
</table>

我的想法是这样的：

table td.string thead th { // if cells in column are of string type 
    text-align:left; 
} 

table td.currency thead th { // if cells in column are of currency type 
    text-align:right; 
}

我知道上面的CSS将无法正常工作，但有一些CSS技巧，会做这样的事情？

来源

2013-05-02 Jon

是列交替，这意味着他们去串，货币，字符串，货币等？如果是这样的话，你可以使用类似于：'th：nth-child（odd）{text-align：left;}'和'th：n-child（even）{text-align：right;}' – Vektor 2013-05-02 14:43:12

不需要，不需要。我试图避免伪选择器，因为我必须支持早期版本的IE。 – Jon 2013-05-02 14:59:48

根据给定的音符

Note: All cells in a single column (under the header) will share the same class type. There is no mixing and matching.

你可以试试这个发生在你的HTML和CSS来实现这一目标。

HTML：

<table> 
     <thead> 
      <tr> 
       <th class="string"> 
        Strings 
       </th> 
       <th> 
        Currency 
       </th> 
      </tr> 
     </thead> 
     <tr class="currency"> 
      <td class="string"> 
       This is a string. 
      </td> 
      <td class="currency"> 
       100.00 
      </td> 
     </tr> 
    </table>

CSS：

.string 
     { 
      text-align: left; 
     } 

     .currency 
     { 
      text-align: right; 
     }

希望这将有助于:)

来源

2013-05-02 14:56:47

是的，我想我可以这样做。 – Jon 2013-05-02 15:00:06

风格标题标题基于列单元格类型

回答

相关问题