複数の行を持つ単純なテーブルがあります。一番上の行には見出しが含まれ、その下の行には data の id 属性があります。id 属性データのみを持つテーブル行に CSS を設定しようとしましたが、これまでテーブル全体にしか設定できませんでした。
<table width = "80%" align="center" id="example">
<tr>
<td><h3>ID</h3></td>
<td><h3>First Name</h3></td>
<td><h3>Last Name</h3></td>
</tr>
<tr id="data">
<td>1</td>
<td>Joe</td>
<td>Schmoe## Heading ##</h3><td>
</tr>
</table>
そしてCSS。#example tr を tr #data に変更しようとしましたが、うまくいきませんでした。単純なものを見落としていることは知っていますが、何がわからないのですか。
table#example {
border-collapse: collapse;
}
tr #data{
background-color: #eee;
border-top: 1px solid #fff;
}
tr #data:hover {
background-color: #ccc;
}
tr #data {
background-color: #fff;
}
tr #data th, tr #data td {
padding: 3px 5px;
}
tr #data td:hover {
cursor: pointer;
}
私は CSS に精通しておらず、id を 1 回しか使用できないことは、必要なものの制限ではないため、クラスを使用していません。