我有一張桌子，我為每隔一行賦予了灰色背景顏色。我如何捕獲這里的空單元格？為什么這些沒有被捕獲在這個 css 中：tr:nth-child(even) { background-color: #dddddd; }執行 td:empty 也不會捕獲塊，所以我有點困惑。這是 HTML <td> <tr> <td colspan="2"> <input type="text" placeholder="Add new email" v-model="email" /> <img @click="addEmailToQ" src="@/assets/Plus.png" /> </td> </tr> <!-- <h2>Emails</h2> --> <tr style="text-align: left" v-for="(email, key) in emailList" :key="key"> {{email}} </tr> </td>
2 回答
拉莫斯之舞
TA貢獻1820條經驗 獲得超10個贊
關于你的“錯誤”：它與CSS無關，你的標記完全是錯誤的。<tr>需要包含<td>，而不是相反。
下面的示例代碼：如果給出了正確的標記，空單元格將具有 CSS 給定的背景顏色。
table {
? width:100%;
}
tr:nth-child(even) {
? background-color: #dddddd;?
}
<table>
? <tr>
? ? <td>Row 1, Cell 1</td>
? ? <td></td>
? ? <td></td>
? </tr>
? <tr>
? ? <td>Row 2, Cell 1</td>
? ? <td></td>
? ? <td></td>
? </tr>
</table>
侃侃爾雅
TA貢獻1801條經驗 獲得超16個贊
確保您包含<td>在所有單元格中，甚至是空單元格<td> </td>
tr:nth-child(even) {
background-color: #dddddd;
}
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta http-equiv="X-UA-Compatible" content="ie=edge" />
<title>Static Template</title>
</head>
<body>
<table style="width:100%">
<tr>
<th>Firstname</th>
<th>Lastname</th>
<th>Age</th>
</tr>
<tr>
<td></td>
<td>Smith</td>
<td></td>
</tr>
<tr>
<td>Eve</td>
<td></td>
<td>94</td>
</tr>
<tr>
<td>Jill</td>
<td>Smith</td>
<td>50</td>
</tr>
<tr>
<td>Eve</td>
<td></td>
<td>94</td>
</tr>
<tr>
<td>Jill</td>
<td></td>
<td>50</td>
</tr>
<tr>
<td>Eve</td>
<td></td>
<td>94</td>
</tr>
</table>
</body>
</html>
- 2 回答
- 0 關注
- 126 瀏覽
添加回答
舉報
0/150
提交
取消