html – CSS使用表格单元格内的文本设置表格单元格背景颜色

html – CSS使用表格单元格内的文本设置表格单元格背景颜色,第1张

概述与 this基本相同的问题 – 文本具有背景颜色集并且位于表格单元格中.文本背景颜色仅在文本后面,并且不会填充整个表格单元格. 解决方案通常是在表格单元格上设置bgcolor.不同之处在于,这种情况发生在整个特定网站的许多地方,并且更改所有相关的表格单元格需要很长时间. 问题是,有没有办法在CSS中说: >使文本背景颜色填充整个表格单元格(如果文本位于表格单元格中);要么….. >如果表格单元格包 与 this基本相同的问题 – 文本具有背景颜色集并且位于表格单元格中.文本背景颜色仅在文本后面,并且不会填充整个表格单元格.

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

问题是,有没有办法在CSS中说:

>使文本背景颜色填充整个表格单元格(如果文本位于表格单元格中);要么…..
>如果表格单元格包含具有样式x的文本元素,那么使该表格单元格具有背景颜色(一种反向继承)?

PS:该网站最初是为ie6开发的,ie6已经用文本的背景颜色填充整个表格单元格,所以最初没有问题. FF和IE 7的工作方式不同.

解决方法 正如大卫多尔沃德所说的那样,没有办法用CSS干净利落地完成你想要的东西,但是我可以想到一些解决方法……

假设你的HTML是这样的(即具有背景颜色的东西是表格单元格中唯一的东西):

<table>    <tr>        <td>test with longish string<br/> over two lines<td>        <td><span  >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类等.

总结

以上是内存溢出为你收集整理的html – CSS使用表格单元格内的文本设置表格单元格背景颜色全部内容,希望文章能够帮你解决html – CSS使用表格单元格内的文本设置表格单元格背景颜色所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错,欢迎将内存溢出网站推荐给程序员好友。

欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/web/1117204.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2022-05-29
下一篇 2022-05-29

发表评论

登录后才能评论

评论列表(0条)

保存