Question

如果我想完全按照表格单元格大小设置图像拉伸，应该怎么做？

我有一张有1行3列的表。每列有1张图片。我试图放置width=33%, height=auto的属性，但是图像显示仍然失真。

Answer 1

您可以使用CSS实现此功能。

auto it = vec.begin();
while (it != vec.end()) { // O(M)
  auto last = find_last_with_same_name(it, it->name); 
  sum += last.value;
  it++;
}

Answer 2

您需要使用 background-size：contain ，但请注意图像的比例和单元格的大小。

请参见以下示例：

HTML ：

<h2>
Test
</h2>

<table class="tab">
  <tr>
    <td>Col 1</td>
    <td>Col 2</td>
    <td>Col 3</td>
  </tr>
</table>

CSS ：

.tab{
  border : 1px solid red;
}

.tab td
{
  color: red;
  font-size: 30px;
  font-weight: bold;
  text-align: center;

  width:200px;
  height:200px;
  background-image: url('https://static.fnac-static.com/multimedia/Images/FR/NR/8a/c9/89/9030026/1540-1/tsp20171113114257/Figurine-Pixel-Pals-Light-Up-Capcom-Street-Fighter-Ryu.jpg');
   background-position: center; 
   background-size: contain;
}

图像背景拉伸整个表格单元格

2 个答案: