Question

<html>
<font face = "arial">
<style>
#periodictable {
   position: static;
   border-top: : solid red 1pt;
   border-right:solid red 1pt;
   border-bottom:solid red 1pt;
   border-left:solid red 1pt;
}
.metalloid {
   background-color : #AF9B60;
}
.metal {
   background-color: #C0C0C0;
}
</style>
<body>
<table width = "202" height = "211">
<div id = "periodictable";>
 <tr>
  <td bgcolor = #AF9B60><div class = "metalloid"><center>B</center></div></td>
  <td><center>C</center></td>
  <td><center>N</center></td>
 </tr>
 <tr>
  <td><div class = "metal"><center>Al</center></div></td>
  <td bgcolor = #AF9B60><div class = "metalloid"><center>Si</center></div></td>
  <td><center>P</center></td>
 </tr>
 <tr>
  <td><div class = "metal"><center>Ga</center></div></td>
  <td><div class = "metalloid"><center>Ge</center></div></td>
  <td><div class = "metalloid"><center>As</center></div></td>
 </tr>
</div>
</table>
</font>
</body>
</html>

所以，基本上对于我的高中HTML / CSS类，我不得不使用CSS创建一个表。通过赋值，需要使用类和id。使用我的代码，我已经分配了类并使用div语句调用它。但是这样做时，只有文本的背景会更改为我指定的颜色。我需要更改整个单元块，如下图所示：

sample

Answer 1

您需要为<td>提供一个类，然后更改它的background-color属性，<div>只有您的css定义的大小或其中的元素 - 不是父元素。

例如..

.metal {
    text-align: center;
    background: silver;
}

...

<tr>
    <td class="metal">Ga</td>
</tr>

由于这基本上是回答您的作业，请尝试自己理解为什么这样做。

使用类更改单元格的背景颜色

1 个答案: