表格單元中的中心文字

我似乎無法找到我的問題的答案。我有一個兩行兩列的表格（如下面顯示的代碼），我如何居中對齊特定單元格中的文本。我想在一個或兩個單元格中居中對齊文本 - 不是所有的單元格。表格單元中的中心文字

<div style="text-align: center;"> 
    <table style="margin: 0px auto;" border="0"> 
     <tbody> 
      <tr> 
       <td>Cell 1</td> 
       <td>Cell 2</td> 
      </tr> 
      <tr> 
       <td>Cell 3</td> 
       <td>Cell 4</td> 
      </tr> 
     </tbody> 
    </table> 
</div>

來源

2011-10-03 Jack Stevens

我會建議使用CSS來做到這一點。您應該創建一個CSS規則來執行定心，例如：

.ui-helper-center { 
    text-align: center; 
}

然後是ui-helper-center類添加至您想要控制的對齊表格單元格：

<td class="ui-helper-center">Content</td>

編輯：因爲這個答案被接受了，所以我覺得有必要編輯出在評論中引起火焰戰爭的部分，並且不要宣傳貧窮和過時的做法。

請參閱Gabe's answer瞭解如何將CSS規則包含到頁面中。

來源

2011-10-03 21:59:13

CSS 1成爲近15年前的建議。不要使用align屬性。 – Quentin

@Quentin - 同意「不要使用'align'」。但Cory Larson自己推薦了「align = center」的CSS等價物。我希望你不要把他記下來（如果你這樣做，請考慮改變它，好嗎？） – paulsm4

@ paulsm4 - 我沒有，他沒有當我發表評論。 – Quentin

如何簡單的（請注意，拿出類名這是一個更好的名字僅僅是一個例子）：

.centerText{ 
    text-align: center; 
} 


<div> 
    <table style="width:100%"> 
    <tbody> 
    <tr> 
     <td class="centerText">Cell 1</td> 
     <td>Cell 2</td> 
    </tr> 
    <tr> 
     <td class="centerText">Cell 3</td> 
     <td>Cell 4</td> 
    </tr> 
    </tbody> 
    </table> 
</div>

例here

可以放置在css一個單獨的文件，這是推薦。在我的示例中，我創建了一個名爲styles.css的文件，並將其中的css規則放入其中。然後將其包含在<head>部分的html文件中，如下：

<head> 
    <link href="styles.css" rel="stylesheet" type="text/css"> 
</head>

的替代，而不是建立一個單獨的css文件，不建議在所有... 在<head>在HTML文檔中創建<style>塊。然後把你的規則放在那裏。

<head> 
<style type="text/css"> 
    .centerText{ 
     text-align: center; 
    } 
</style> 
</head>

來源

2011-10-03 21:59:05 Gabe

表格單元中的中心文字

回答

相關問題