5

我需要增加文本，但如果我在 IE、Opera 和 Chrome 中将类应用于 TD 或 TR，则所有单元格都会上升（背景和边框以及单元格中的文本）。请看示例：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
  <head>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  <title>Untitled Document</title>
  <style>
  .myClass  td{
      position:relative;
      top:-8px;
      color:blue;
      }

  .myClass {
      position:relative;
      top:-8px;
      color:blue;
      } 
td { border: red solid 2px ;}   
  </style>
  </head>
<body>
<p>&nbsp;</p>
<table  width="384" height="89" border="2" cellpadding="0" cellspacing="3" bgcolor="#cccccc">
    <tr >
      <td width="109" bgcolor="#FFCC00">&nbsp;</td>
      <td width="255" bgcolor="#00CCFF" class="myClass">this TD have class=&quot;.myClass&quot;</td>
</tr>
<tr  class="myClass">
      <td bgcolor="#999999">&nbsp;</td>
      <td bgcolor="#FFFF00">this TR have class=&quot;.myClass&quot;</td>
    </tr>
    <tr>
      <td bgcolor="#666666">&nbsp;</td>
      <td bgcolor="#FFFFFF"><span class="myClass">this text within span-tags (.myClass)</span></td>
    </tr>
</table>
</body>
</html>

Firefox 不影响是否应用于 tr_or_td，仅影响带有 span-tag 的文本。

如果在行的每个 TD 中放置文本，则每个浏览器都可以正常工作

<span class="tdclass"> mytext in span-tag </span>

问题） ：

  1. 是否有一些 css 结构仅将样式分配给 TD 内的数据而不是此 TD

    tr.myclass TD {}

在 IE、Opera、Chrome 中适用于所有单元格，在 Firefox 中根本不起作用。

  1. 是否有一些 TEXT 的 CSS 选择器 - 我的意思是例如：

    .myclass > b

    将在带有 .myclass 的标签中应用我们有 b-tag

    可能像 EVERY_TEXT 这样的词 - 可能是这样的选择器，例如：

    .myclass > EVERY_TEXT {}

  2. 任何人都可以提出另一种可行的方法来增加表格所有单元格中的文本，而不需要每个单元格中的跨度，并且没有.js

感谢您的帮助！

4

4 回答 4

1

使用星号选择 DOM 的该部分中的所有元素，例如

​&lt;div ​​​​class="one">
    testing <br/>
    <span> Test </div>
</div>​​​​​​​​​​​​​​​​​​


.one * {
    color: red;
}

Fiddle here，如果你需要检查它

于 2012-04-30T23:36:55.700 回答
0

您可以在 TD 单元格中的内容周围添加一个 span 标签，并将 CSS 应用于 span。

<td>
    <span class="styled_cell_content">Content</span>
</td>
于 2012-04-30T23:14:25.057 回答
0

如果您仍在寻找此问题的答案，则需要在 td（和 th）级别专门设置边框 - 在 IE 中，这优先于整个元素上设置的颜色。例如，将此添加到您的 css，现在 IE 将使用它来设置边框样式，并且 td 上设置的颜色不会改变它！

td, th {
    border: 1px solid #000;
}
于 2013-06-01T11:00:34.307 回答
0

您是否尝试过负填充？

.myClass,
.myClass td {
    color:blue;
    padding-top: -8px;
}
于 2012-05-01T00:03:15.897 回答