0

我有一张桌子，我希望某些 tr 具有与它之前的 tr 相同的 css 类。

在下面的示例中，带有 class="?" 的 tr 应该与上面的类相同。这可能吗？

<table>
  <tr class="red">
    <td></td>
  </tr>
  <tr class="?">
    <td></td>
  </tr>
  <tr class="blue">
    <td></td>
  </tr>
  <tr class="?">
    <td></td>
  </tr>
</table>
4

6 回答 6

1

每个 html 元素都可以用 css 寻址，所以在stylesheet你的 css 中，如果你像这样 decalre 在这种情况下，元素将是tr，所有表行都将具有你在上面的一般声明中设置的属性，如果你想覆盖您的某些特定值可以像使用类一样解决它们element{
set the desired property ; }
table rows

于 2013-08-22T16:09:46.810 回答
1

试试这个：

HTML：

<table border="1" style="border-collapse:collapse;">
    <tr><td>Data</td><td>Data</td></tr>
    <tr><td>Data</td><td>Data</td></tr>
    <tr><td>Data</td><td>Data</td></tr>
    <tr><td>Data</td><td>Data</td></tr>
    <tr><td>Data</td><td>Data</td></tr>
    <tr><td>Data</td><td>Data</td></tr>
    <tr><td>Data</td><td>Data</td></tr>
    <tr><td>Data</td><td>Data</td></tr>
    <tr><td>Data</td><td>Data</td></tr>
    <tr><td>Data</td><td>Data</td></tr>
    <tr><td>Data</td><td>Data</td></tr>
    <tr><td>Data</td><td>Data</td></tr>
</table>

jQuery：

$(function(){
    $("tr").addClass("red");
    $("tr:nth-child(4n)").removeClass("red").addClass("blue")
        .prev().removeClass("red").addClass("blue");
});

这将选择每第 4 个子元素，删除红色 CSS 类，添加蓝色 CSS 类并移动到前一个元素并执行相同操作。

注意：这是一个jsFiddle，您可以使用它。

于 2013-08-22T16:12:12.377 回答
1

基于卡尔的想法。

使用 jQuery

http://jsfiddle.net/forX/KBfzD/

$(function(){
    $(".unknown").each(function()
                       {

                           $(this).removeClass("unknown");
                           $(this).addClass( 
                                           $(this)
                                          .prev()
                                           .attr("class")
                           );
                       });
});

我改变 ? 为未知。我不知道怎么用？在 css/css 选择器中。

于 2013-08-22T16:30:14.297 回答
0

我不太确定是否理解这个问题，但是：
在 css: 中tr.classname + tr为您提供了 tr 中具有类名的下一个 tr。看到这个小提琴。
您还可以检查css nth-child,even & odd selectors。

于 2013-08-22T16:15:48.407 回答
0

根据您提到的内容，这是 fiddle。它只检查类的前一个元素：?

于 2013-08-22T16:30:25.923 回答
0

如果没有 javascript，您可以使用 element:li:nth-child(x) 值可以是 n、n+1、2n+1 等任何值……您可以给它们不同的值。

于 2013-08-22T16:33:13.400 回答