html - 如何在 HTML/CSS 中设置数据单元格的背景？

Question

我正在尝试将每个数据单元格的背景图像设置为图像。当我使用下面显示的方法时，我只得到照片的左上角。

如下图，我只是简单地将每个数据单元格的背景设置为我选择的图像；但是，我认为需要对类进行更多样式设置。有谁知道那会是什么？

.example {
  background-image: url("https://i.ytimg.com/vi/MPV2METPeJU/maxresdefault.jpg");
}

<table class="example">
  <tr>
    <td>
      <p> ONE </p>
    </td>
    <td>
      <p> TWO </p>
    </td>
  </tr>
</table>

score 0 · Accepted Answer

首先，如果你想要单元格中的图像，你必须td在你的 css 中选择。然后，用于background-size确定图像的大小。

.example td {
  background-image: url("https://i.ytimg.com/vi/MPV2METPeJU/maxresdefault.jpg");
  background-size: cover;
}

<table class="example">
  <tr>
    <td>
      <p> ONE </p>
    </td>
    <td>
      <p> TWO </p>
    </td>
  </tr>
</table>

1 回答 1