在CSS中定義表格列的一般寬度

如何爲表格的列定義一些常規屬性？例如，在下表中我有2列。我想要左欄的寬度爲30px，右欄的寬度爲70px。對於下面的例子，我在每一行都寫了一個CSS類名。有沒有一種方法可以用更一般的方式來完成？謝謝。在CSS中定義表格列的一般寬度

<table width="100px" cellspacing="0"> 
      <tbody> 
       <tr>     
        <td class="left">30px wide</td> 
        <td class="right">70px wide</td> 
       </tr> 

       <tr>     
        <td class="left">30px wide</td> 
        <td class="right">70px wide</td> 
       </tr> 

       <tr>     
        <td class="left">30px wide</td> 
        <td class="right">70px wide</td> 
       </tr> 

       <tr>     
        <td class="left">30px wide</td> 
        <td class="right">70px wide</td> 
       </tr>  

      </tbody> 
     </table>

來源

2011-02-13 adam

，並在每排中，我寫的CSS類名。有沒有辦法以更一般的方式做到這一點？

我假定你的意思「......在每一個列」。不，如果你想跨瀏覽器支持，這當然是唯一的方法。

在CSS 3，還有就是:nth-child僞類，但它完全由FF >= 3.5 and Chrome.

來源

2011-02-13 11:34:34

只支持剛剛在第一行定義td類。請參閱example。

來源

2011-02-13 11:37:25 gor

就足夠了定義第一個TD的......它看起來像：

<table width="100px" cellspacing="0"> 
      <tbody> 
       <tr>     
        <td class="left">30px wide</td> 
        <td class="right">70px wide</td> 
       </tr> 
       <tr>     
        <td>30px wide</td> 
        <td>70px wide</td> 
       </tr> 

       <tr>     
        <td>30px wide</td> 
        <td>70px wide</td> 
       </tr> 

       <tr>     
        <td>30px wide</td> 
        <td>70px wide</td> 
       </tr>  

      </tbody> 
     </table>

來源

2011-02-13 11:52:43 Chugworth

謝謝，它有效嗎？ – adam 2011-02-13 11:54:24

使用<th>標籤表格的第一行，然後你可以有：

th.left { 
width: 30px; 
} 

th.right { 
width: 70px; 
}

來源

2011-02-13 11:58:05

你可以使用<col>元素一次定義列的寬度。像

<table> 
<col class="left"> 
<col class="right"> 
<tr> 
    <td>30px wide</td> 
    <td>70px wide</td> 
</tr> 
<tr> 
    <td>30px wide</td> 
    <td>70px wide</td> 
</tr> 
</table>

注意的東西，不過，你可以設置的樣式是相當有限的 - 到目前爲止，只有width和我background-color工作（在Chrome 9）。因此，如果您還有其他設置（類型，字體大小，文字顏色，對齊方式等），您可能需要堅持每個<td>上的課程。

來源

2011-02-13 11:58:31 cHao

在CSS中定義表格列的一般寬度

回答

相關問題