Table odd even td with multicolor

Question

I have a table styled with CSS with even and odd. The td even/odd CSS codes:

#table_box tr:nth-child(odd) td { background-color:#ffffff } /*odd*/
#         


        

Answer 1

Use this fragments:
HTML changes:

        
                1
                ۱۳۹۱/۰۴/۳ ۰۹:۴۹:۴۷
                ۱۳۹۱/۰۴/۳ ۱۲:۱۹:۴۰
                2.5
                2.5
                6.75MB
                54.13MB
                60.87MB
                60.87MB
            

CSS changes:

#table_box tr:nth-child(odd) td { background-color:#ffffff } /*odd*/
#table_box tr:nth-child(even) td.greenh2 { background-color:#f00} /* even*/
#table_box tr:nth-child(even) td.blueh2 { background-color:#0f0} /* even*/
#table_box tr:nth-child(even) td.purpleh2 { background-color:#00f} /* even*/
#table_box tr:hover td { background-color:#fffbae; } /* hovering */

th.grey{
color:#7c7c7c!important;
}
th.blueh{
background-color:#174797;
color:#FFF!important;
}
th.blueh2{
background-color:#5492cf;
color:#FFF!important;
padding:3px!important;
}
th.greenh{
background-color:#579f0f;
color:#FFF!important;
}
th.greenh2{
background-color:#a4dd4f;
color:#FFF!important;
padding:3px!important;
}
th.purpleh{
background-color:#8e04ca;
color:#FFF!important;
}
th.purpleh2{
background-color:#d984fd;
color:#FFF!important;
padding:3px!important;
}

You'll need to tweak it some more to fit your desired output, but I guess the general idea is clear.
You could also do it with plain CSS without changing your HTML code if you want:

#table_box tr:nth-child(odd) td { background-color:#ffffff } /*odd*/
#table_box tr:nth-child(even) td:nth-child(1) { background-color:#f00} /* even*/
#table_box tr:nth-child(even) td:nth-child(2) { background-color:#0f0} /* even*/
#table_box tr:nth-child(even) td:nth-child(3) { background-color:#00f} /* even*/
#table_box tr:hover td { background-color:#fffbae; } /* hovering */

etc.