1

私は現在、偶数と奇数の行でゼブラストライピングを行っているテーブルを持っていますが、これは正常に機能します。私の問題は、異なる色スタイルの新しい行を示すために使用されるクラスもあるということです。この新しいクラスは、ゼブラ ストライプ CSS によってオーバー スローされているようですが、これを回避する方法はありますか? ヒントや提案をいただければ幸いです。

このテーブルを制御する CSS の一部を次に示します。

   #table tbody tr:nth-child(odd){
    background-color: #cccccc; color:black;
     }
   #table tbody tr:nth-child(even){
   background: #EBEBEB; color: #7D7D7D;
    }
   #table tbody tr:nth-child(2n+1):hover{
        cursor:pointer;
        /* add gradient */
        background-color: #808080;
        background: -webkit-gradient(linear, left top, left bottom, from(#909090), to(#606060));
        background: -moz-linear-gradient(top, #909090, #606060);
        color: #dadada;
        font-weight: ;
    }
  #table tbody tr:nth-child(2n):hover{
        cursor:pointer;
        /* add gradient */
        background-color: #808080;
        background: -webkit-gradient(linear, left top, left bottom, from(#909090),        to(#606060));
        background: -moz-linear-gradient(top, #909090, #606060);
        color: #dadada;

    }
  .new {
    background-color: #760086;
    color:white;
       }
4

1 に答える 1

0

新しく作成された要素のコードの前に、ゼブラ ストリップ行の CSS を配置すると、うまくいくはずです。

p:nth-child(2n+1){
    /*blah*/
}
p:nth-child(2n){
    /*blah*/
}
p.new{
    /*blah*/
}

ライブデモ: http://jsfiddle.net/DerekL/ZFcKs/

于 2013-01-14T07:15:31.610 に答える