CSS表格填充

Question

我正在學習CSS和HTML。 在我的代碼有：

<style> 
table, td, th 
{ 
padding: 5px; 
} 
</style> 

此規則適用於網頁上的所有表。 現在我想打一個表不填充： 這裏是源：

<table> 

    <tr> 
    <td>Login</td> 
    <td><input type="text" name="login" class="input"></td> 
    </tr> 

    <tr> 
    <td>Password</td> 
    <td><input type="password" name="password" class="input"></tr> 
    </tr> 

</table> 

如何做到這一點？提前致謝。

P.S：我真的來自俄羅斯，所以對不起壞英語

Answer 1

如果你想具體樣式添加到該表中覆蓋默認樣式您已經定義了，那麼你需要一些方法在CSS中引用它。

通常情況下，你想給它一個類或ID - 例如：<table class='myspecialtable'>....</table>

然後你就可以擁有它覆蓋默認5px的樣式，只是這個表的樣式表。

.myspecialtable, .myspecialtable td, .myspecialtable th { 
    padding: 0px; 
} 

如果您不能ID或類添加到這個表，那麼你可以將其添加父元素上，效果是相同的（只要是家長不包含任何其他表格，當然）。在這種情況下，你的CSS會是這個樣子：

.myspecialtablecontainer table, .myspecialtablecontainer td, .myspecialtablecontainer th { 
    padding: 0px; 
} 

Answer 2

你應該改變你的CSS定義樣式代替。

.padded { ... } 

然後你可以設置class到樣式要使用該樣式的任何表。

<table class="padded"> 
</table> 

當您設置一個風格，你所做的一切，對於一個特定的類型，然後將其刪除的唯一途徑的所有元素是設置樣式爲別的，或者不包括對CSS參考文件從您不想使用它們的頁面。

Answer 3

<table cellpadding='0'>如果不工作，你可以創建一個CSS類，去除填充和使用，在你的表：<table class='no_padding'>

Answer 4

一個辦法是給你的表一類，像這樣：

<table class="nopadding"> 
[... table rows and columns...] 
</table> 

然後把這個在你的CSS：

.nopadding, .nopadding td, .nopadding th 
{ 
    padding: 0; 
} 

其中說「任何具有類的元素應該有一個填充0」。 .nopadding th和.nopadding td必須在那裏，並且是一種說法，「所有thop和td誰在類nopadding的元素中都不應該有任何填充」，因爲您之前告訴所有th和td都有一個5px的填充。

Answer 5

簡單使用

<style> 
table, td, th 
{ 
    padding: 0px; 
} 
</style> 

也可以嘗試border-collapse: collapse;。

Answer 6

我記得我剛開始學習HTML時。

您所追求的是ID或類別屬性。你有兩個表所示：

<table class="table1"> 

    <tr> 
    <td>Login</td> 
    <td><input type="text" name="login" class="input"></td> 
    </tr> 

    <tr> 
    <td>Password</td> 
    <td><input type="password" name="password" class="input"></tr> 
    </tr> 

</table> 

<table class="table2"> 

    <tr> 
    <td>Login</td> 
    <td><input type="text" name="login" class="input"></td> 
    </tr> 

    <tr> 
    <td>Password</td> 
    <td><input type="password" name="password" class="input"></tr> 
    </tr> 

</table> 

要提出的是，使表1有填充物，但表2沒有，你可以使用相應的CSS規則來識別和樣式表：

.table1, .table1 td, .table1 th 
{ 
padding: 5px; 
} 

.table2, .table2 td, .table2 th 
{ 
padding: 0px; 
} 

有很多方法可以用CSS做到這一點。例如，在這種情況下，您也可以使用ids，但使用類更容易，因爲id只能在每個文檔中使用一次。

在這種情況下，稍好的方法是利用級聯規則。我也許會把你原來的CSS和剛添加的第二組規則：

.table, .table td, .table th 
{ 
padding: 5px; 
} 

.table2, .table2 td, .table2 th 
{ 
padding: 0px; 
} 

在這種情況下，只有用類表2表將有0像素填充 - 所有其他表將有5像素的填充。

閱讀W3C學校對CSS的介紹 - http://www.w3schools.com/css/css_intro.asp將是一個不錯的主意。這將向您介紹基本知識並幫助您走上正軌。