6

与此基本相同的问题- 文本具有背景颜色集并且位于表格单元格中。文本背景颜色仅在文本后面，并没有填满整个表格单元格，它应该填满。

解决方案通常是在表格单元格上设置 bgcolor。不同之处在于，这发生在这个特定网站的许多地方，并且更改所有相关的表格单元格需要很长时间。

问题是，有没有办法在 CSS 中说：

  1. 使文本背景颜色填充整个表格单元格（如果文本在表格单元格中）；或者.....
  2. 如果表格单元格包含具有样式 x 的文本元素，那么使该表格单元格具有背景颜色（一种反向继承）？

PS：网站最初是为IE6开发的，IE6已经用文本的背景色填充了整个表格单元格，所以最初没有问题。不过，FF 和 IE 7+ 的工作方式不同。

4

3 回答 3

8

正如 David Dorward 所说，没有办法用 CSS 干净利落地做你想做的事，但是我可以想到一些解决方法......

假设您的 html 是这样的（即具有背景颜色的东西是表格单元格中唯一的东西）：

<table>
    <tr>
        <td>test with longish string<br/> over two lines<td>
        <td><span class="bg" >test</span></td>
    </tr>
    <tr>
        <td>test with longish string<br/> over two lines<td>
        <td>test with longish string<br/> over two lines<td>
    </tr>
</table>

您可以对您的 CSS 执行此操作：

td { height: 100%;}
.bg { background-color: #f00; width: 100%; height: 100%; display: block; }

它适用于这个简单的示例（至少在 Firefox 3.5 中），但可能会产生其他副作用，具体取决于您的 html 内容的外观。

编辑：如果您可以通过 javascript 破解它，另一种选择是使用 jQuery，如下所示：

$(function() { $("td:has(span.bg)").addClass("bg"); });

这适用于上面的示例 html/css，但显然需要更改以匹配您的 css 类等。

于 2009-07-29T06:30:00.707 回答
0

不。

至少目前，CSS 无法根据文档中该元素的开始标记之后出现的任何内容来设置元素的样式。所以你不能根据它的内容来设计一个元素。

于 2009-07-29T06:21:45.387 回答
0

好吧，如果您只想覆盖整个单元格，则不需要 css，除非您想使用它：

<table width="100" height="100" border="2">
<tbody>
<tr>
<td bgcolor='red'>This is Red</td>
</tr>
<tr>
<td bgcolor='blue'>This is Blue</td>
</tr>
</tbody>
</table>

它适用于 FireFox 和 IE8 和 7。即使文本没有，它也会覆盖整个单元格。

于 2009-07-29T13:51:12.963 回答