我想要一個不同的顏色僅用於html表格的第一行

我使用了一個表格。我申請了CSS ID table-4。我想要一個不同的顏色僅用於html表格的第一行

繼html代碼：

<table border='0' width='100%' id='table-4'> 
    <tr><td>Date</td><td>Headline</td></tr> 
    <tr><td>29 DEC</td><td>Dead</td></tr> 
    <tr><td>30 DEC</td><td>Hit</td></tr> 
    <tr><td>02 JAN</td><td>Leg</td></tr> 
</table>

這裏是style.css中：

#table-4 { background-color: #F2F2F2;}

所以整個表的背景顏色爲#F2F2F2，但我想不同的顏色中的第一行，其中Date和Headline去，所以我怎麼可以修改我的CSS這個東西？

來源

2013-01-04 Shahriar Kabir

如果不能使用表格'tr：first-child td'選擇器 –

我不能讓你，喬納森。 –

http://www.w3schools.com/tags/tag_thead.asp –

您可以使用：第一胎這一點。像這樣寫：

#table-4 tr:first-child{ 
    background:red; 
}

入住這http://jsfiddle.net/cbK8J/

來源

2013-01-04 09:30:38 sandeep

它的工作，謝謝。你能告訴我怎樣才能改變第一排的文字顏色嗎？ –

簡單地在括號內添加您的樣式屬性。檢查這個http://jsfiddle.net/cbK8J/1/ – sandeep

非常感謝兄弟 –

@JonathandeM.'s comment是正確的。流行<thead>和<tbody>標籤在那裏，並更改<thead>行的<td>標籤<th>標籤（因爲HTML說的事情是什麼，他們的標題）：

<table border='0' width='100%' id='table-4'> 
    <thead> 
     <tr><th scope="col">Date</th><th scope="col">Headline</th></tr> 
    </thead> 
    <tbody> 
     <tr><td>29 DEC</td><td>Dead</td></tr> 
     <tr><td>30 DEC</td><td>Hit</td></tr> 
     <tr><td>02 JAN</td><td>Leg</td></tr> 
    </tbody> 
</table>

然後CSS使標題行有不同的背景顏色是：

#table-4 thead tr { 
    background-color: green; 
}

來源

2013-01-04 09:28:20

您必須添加ID到第一tr標籤：

<table border='0' width='100%' id='table-4'> 
    <tr id ="r1" ><td>Date</td><td>Headline</td></tr> 
    <tr><td>29 DEC</td><td>Dead</td></tr> 
    <tr><td>30 DEC</td><td>Hit</td></tr> 
    <tr><td>02 JAN</td><td>Leg</td></tr> 
    </table>

然後添加另一個CSS行：

#table-4 #r1 { background-color: blue;}

它會給你一個藍色

來源

2013-01-04 09:29:46

或者您可以使用'：first-child'選擇器。 –

好吧，你可以'＃table-4 tr：first-child {background-color：blue;}' –

它工作，謝謝。你能告訴我怎樣才能改變第一排的文字顏色嗎？ –

，你可以這樣做：

HTML：

<td class="whatever">Date</td><td class="whatever">Headline</td>

CSS：

.whatever { color: #a9a9a9 }

<tr>會做這一行，<td>將做的單元格。

來源

2013-01-04 09:40:32 user1894814

我想要一個不同的顏色僅用於html表格的第一行

回答

相關問題