将样式应用于仅第一级td标签 [英] Apply style to only first level of td tags

问题描述

有没有办法只对一级td标签应用Class'样式？

Is there a way to apply a Class' style to only ONE level of td tags?

<style>.MyClass td {border: solid 1px red;}</style>

<table class="MyClass">
  <tr>
    <td>
      THIS SHOULD HAVE RED BORDERS
    </td>
    <td>
      THIS SHOULD HAVE RED BORDERS
      <table><tr><td>THIS SHOULD NOT HAVE ANY</td></tr></table>
    </td>
  </tr>
</table>

推荐答案

Is there a way to apply a Class' style to only ONE level of td tags?

是 ^* ：

.MyClass>tbody>tr>td { border: solid 1px red; }

但是！ '> '直接子选择器在IE6中不起作用。如果你需要支持那个浏览器（你可能会这样做，alas），你可以单独选择内部元素并取消设置样式：

But! The ‘>’ direct-child selector does not work in IE6. If you need to support that browser (which you probably do, alas), all you can do is select the inner element separately and un-set the style:

.MyClass td { border: solid 1px red; }
.MyClass td td { border: none; }

---

^* 第一个示例引用在您的HTML中找不到的 tbody 元素。它应该已经在你的HTML，但浏览器通常是确定的离开它...他们只是添加在幕后。

---

^*Note that the first example references a tbody element not found in your HTML. It should have been in your HTML, but browsers are generally ok with leaving it out... they just add it in behind the scenes.

这篇关于将样式应用于仅第一级td标签的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！