表格的背景图片答案

【问题标题】：Backgroung image for a table表格的背景图片
【发布时间】：2023-04-10 14:00:02
【问题描述】：

我们如何将图片集成为表格的背景图像..

  <table>
  <tr>
  <td><textarea>Some data here.....</textarea>
  </td>
   <td></td>
  </tr>
  <tr>
  <td><textarea>Some data here.....</textarea>
  </td>
   <td></td>
  </tr>

谢谢..

【问题讨论】：

标签： html css tags css-selectors

【解决方案1】：

您是在问如何将背景图像分配给表格？与任何其他 HTML 元素一样。

在 CSS 中：

table.mytable
 { background-image: url(your_image.gif); }

在 HTML 中：

<table class="mytable">

参考：

background-image property at w3schools

有关其他参数background-repeat 和background-position，请参见该页面。

【讨论】：

值得注意的是table-row的背景会出现在table-row的背景之上，table-cell background-image会出现在table-row的背景之上，所以你可能需要/想要将background-color: transparent; 分配给tr, td。

【解决方案2】：

table {
    background-image: url(/images/foo.png);
}

【讨论】：

【解决方案3】：

继续 Pekka 的示例。

table.mytable td
 { background-image: url(your_image.gif); }

会让你在每个单元格中放一张背景图片

如果您对<td class="myClass"> 应用了类属性，则可以为各个单元格添加自定义背景。

【讨论】：

【解决方案4】：

内联 css like - style="background-image: url(your_image.gif);" - 不太好。

在我看来，将 bg 放到桌面上的最佳方式是 ;

html : table > tr > td.wide

css : table tr td.wide{background:#ffffff url(/images/bg.png) 重复;}

【讨论】：