waay2kool Posted January 1, 2014 Share Posted January 1, 2014 Hi, I have created a table where each row is an alternating color green then cream then green etc. My html looks like: <table border="2" cellspacing="2" cellpadding="2" width="90%"><tr bgcolor="pms3275"><td width="25%"><font color="white">PRODUCT NUMBER</font></td><td width="20%"><font color="white">DESCRIPTION</font></td><td width="5%"><font color="white">DURO METER</font></td><td width="25%"><font color="white">SIZE</font></td><td width="5%"><font color="white">UNIT</font></td><td width="10%"><font color="white">LIST PRICE</font></td><td width="10%"><font color="white">SHOPPING CART</font></td></tr><tr bgcolor="teal"><td>NON-REINFORCED</TD><TD>SHEETING</td><td>Shore A</td><td></td><td></td><td></td><td></td></tr><tr bgcolor="#FFFFCC"><td>SH-20001-002</TD><td>Non-Reinforced Sheeting</td><td>40</td><td>6" x 8" x .002" Matte</td><td>each</td><td>$70.00</td><td><a href='http://grcht.tlyfy.servertrust.com/ShoppingCart.asp?ProductCode=SH-20001-002'>Add to Cart</a></td></tr><tr bgcolor="#CCFFFF"><td>CUST-20001-002</TD><td>Non-Reinforced Sheeting</td><td>40</td><td>12" x 16" x .002" Matte</td><td>each</td><td>$140.00</td><td><a href='http://grcht.tlyfy.servertrust.com/ShoppingCart.asp?ProductCode=CUST-20001-002'>Add to Cart</a></td></tr><tr bgcolor="#FFFFCC"><td>SH-20001-003</TD><TD>Non-Reinforced Sheeting</TD><td>40</td><TD>6" x 8" x .003" Matte</TD><TD>each</TD><TD>$75.00</TD><td><a href='http://grcht.tlyfy.servertrust.com/ShoppingCart.asp?ProductCode=SH-20001-003'>Add to Cart</a></td></tr><tr bgcolor="#CCFFFF"><td>SH-20001-004</TD><TD>Non-Reinforced Sheeting</TD><td>40</td><TD>6" x 8" x .004" Matte</TD><TD>each</TD><TD>$75.00</TD><td><a href='http://grcht.tlyfy.servertrust.com/ShoppingCart.asp?ProductCode=SH-20001-004'>Add to Cart</a></td></tr><tr bgcolor="#FFFFCC"><td>CUST-20001-005</TD><TD>Non-Reinforced Sheeting</TD><td>40</td><TD>12" x 12" x .005" Matte</TD><TD>each</TD><TD>$130.00</TD><td><a href='http://grcht.tlyfy.servertrust.com/ShoppingCart.asp?ProductCode=CUST-20001-005'>Add to Cart</a></td></tr><tr bgcolor="#CCFFFF"><td>SH-20001-005</TD><td>Non-Reinforced Sheeting</td><td>40</td><td>6" x 8" x .005" Gloss</td><td>each</td><td>$80.00</td><td><a href='http://grcht.tlyfy.servertrust.com/ShoppingCart.asp?ProductCode=SH-20001-005'>Add to Cart</a></td></tr><tr bgcolor="#FFFFCC"><td>CUST-20001-010</TD><TD>Non-Reinforced Sheeting</TD><td>50</td><TD>12" x 12" x .010" Gloss</TD><TD>each</TD><TD>$140.00</TD><td><a href='http://grcht.tlyfy.servertrust.com/ShoppingCart.asp?ProductCode=CUST-20001-010'>Add to Cart</a></td></tr><tr bgcolor="#CCFFFF"><td>SH-20001-010</TD><td>Non-Reinforced Sheeting</td><td>50</td><td>6" x 8" x .010" Gloss</td><td>each</td><td>$80.00</td><td><a href='http://grcht.tlyfy.servertrust.com/ShoppingCart.asp?ProductCode=SH-20001-010'>Add to Cart</a></td></tr><tr bgcolor="#FFFFCC"><td>SH-20001-013</TD><td>Non-Reinforced Sheeting</td><td>40</td><td>6" x 8" x .013" Matte</td><td>each</td><td>$50.00</td><td><a href='http://grcht.tlyfy.servertrust.com/ShoppingCart.asp?ProductCode=SH-20001-013'>Add to Cart</a></td></tr><tr bgcolor="#CCFFFF"><td>SH-20001-020</TD><td>Non-Reinforced Sheeting</td><td>50</td><td>6" x 8" x .020" Gloss</td><td>each</td><td>$90.00</td><td><a href='http://grcht.tlyfy.servertrust.com/ShoppingCart.asp?ProductCode=SH-20001-020'>Add to Cart</a></td></tr><tr bgcolor="#FFFFCC"><td>SH-20001-040C</TD><td>Non-Reinforced Sheeting</td><td>50</td><td>2.5" x 3" x .040" Gloss</td><td>each</td><td>$25.00</td><td><a href='http://grcht.tlyfy.servertrust.com/ShoppingCart.asp?ProductCode=SH-20001-040C'>Add to Cart</a></td></tr><tr bgcolor="#CCFFFF"><td>SHS-20001-040</TD><TD>Non-Reinforced Sheeting</TD><td>50</td><TD>4" x 6" x .040" Gloss</TD><TD>each</TD><TD>$40.00</TD><td><a href='http://grcht.tlyfy.servertrust.com/ShoppingCart.asp?ProductCode=SHS-20001-040'>Add to Cart</a></td></tr><tr bgcolor="#CCFFFF"><td>SH-20001-040</TD><td>Non-Reinforced Sheeting</td><td>50</td><td>6" x 8" x .040" Gloss</td><td>each</td><td>$100.00</td><td><a href='http://grcht.tlyfy.servertrust.com/ShoppingCart.asp?ProductCode=SH-20001-040'>Add to Cart</a></td></tr><tr bgcolor="#FFFFCC"><td>SHS-20001-062</td><td>Non-Reinforced Sheeting</td><td>50</td><td>4" x 6" x .062" Gloss</td><td>each</td><td>$50.00</td><td><a href='http://grcht.tlyfy.servertrust.com/ShoppingCart.asp?ProductCode=SHS-20001-062'>Add to Cart</a></td></tr><tr bgcolor="#CCFFFF"><td>SH-20001-062</TD><td>Non-Reinforced Sheeting</td><td>50</td><td>6" x 8" x .062" Gloss</td><td>each</td><td>$110.00</td><td><a href='http://grcht.tlyfy.servertrust.com/ShoppingCart.asp?ProductCode=SH-20001-062'>Add to Cart</a></td></tr><tr bgcolor="#FFFFCC"><td>SH-20001-062C</TD><td>Non-Reinforced Sheeting</td><td>50</td><td>2.5" x 3" x .062" Gloss</td><td>each</td><td>$25.00</td><td><a href='http://grcht.tlyfy.servertrust.com/ShoppingCart.asp?ProductCode=SH-20001-062C'>Add to Cart</a></td></tr><tr bgcolor="#CCFFFF"><td>SHS-20001-080</TD><td>Non-Reinforced Sheeting</td><td>40</td><td>4" x 6" x .080" Matte</td><td>each</td><td>$50.00</td><td><a href='http://grcht.tlyfy.servertrust.com/ShoppingCart.asp?ProductCode=SHS-20001-080'>Add to Cart</a></td></tr><tr bgcolor="#FFFFCC"><td>SH-20001-080</TD><td>Non-Reinforced Sheeting</td><td>40</td><td>6" x 8" x .080" Matte</td><td>each</td><td>$120.00</td><td><a href='http://grcht.tlyfy.servertrust.com/ShoppingCart.asp?ProductCode=SH-20001-080'>Add to Cart</a></td></tr><tr bgcolor="teal"><td>REINFORCED</td><td>SHEETING</td><td></td><td></td><td></td><td></td><td></td></tr><tr bgcolor="#CCFFFF"><td>SH-21001-007</TD><td>Reinforced Sheeting</td><td>40</td><td>6" x 8" x .007" Gloss</td><td>each</td><td>$130.00</td><td><a href='http://grcht.tlyfy.servertrust.com/ShoppingCart.asp?ProductCode=SH-21001-007'>Add to Cart</a></td></tr><tr bgcolor="#FFFFCC"><td>CUST-21001-007</td><td>Reinforced Sheeting</td><td>40</td><td>12" x 16" x .007" Gloss</td><td>each</td><td>$600.00</td><td><a href='http://grcht.tlyfy.servertrust.com/ShoppingCart.asp?ProductCode=CUST-21001-007'>Add to Cart</a></td></tr><tr bgcolor="#CCFFFF"><td>SH-21001-020</td><td>Reinforced Sheeting</td><td>40</td><td>6" x 8" x .020" Gloss</td><td>each</td><td>$120.00</td><td><a href='http://grcht.tlyfy.servertrust.com/ShoppingCart.asp?ProductCode=SH-21001-020'>Add to Cart</a></td></tr><tr bgcolor="#FFFFCC"><td>SHS-21001-030</td><td>Reinforced Sheeting</td><td>40</td><td>4" x 6" x .030" Gloss</td><td>each</td><td>$50.00</td><td><a href='http://grcht.tlyfy.servertrust.com/ShoppingCart.asp?ProductCode=SHS-21001-030'>Add to Cart</a></td></tr><tr bgcolor="#CCFFFF"><td>SH-21001-030</td><td>Reinforced Sheeting</td><td>40</td><td>6" x 8" x .030" Gloss</td><td>each</td><td>$130.00</td><td><a href='http://grcht.tlyfy.servertrust.com/ShoppingCart.asp?ProductCode=SH-21001-030'>Add to Cart</a></td></tr><tr bgcolor="#FFFFCC"><td>SH-21001-040</td><td>Reinforced Sheeting</td><td>40</td><td>6" x 8" x .040" Gloss</td><td>each</td><td>$140.00</td><td><a href='http://grcht.tlyfy.servertrust.com/ShoppingCart.asp?ProductCode=SH-21001-040'>Add to Cart</a></td></tr><tr bgcolor="teal"><td>FIRM</td><td>SHEETING</TD><td></td><td></td><td></td><td></td><td></td></tr><tr bgcolor="#CCFFFF"><td>SHS-22001-020</td><td>Firm Sheeting</td><td>60</td><td>4" x 6" x .020" Gloss</td><td>each</td><td>$40.00</td><td><a href='http://grcht.tlyfy.servertrust.com/ShoppingCart.asp?ProductCode=SHS-22001-020'>Add to Cart</a></td></tr><tr bgcolor="#FFFFCC"><td>SH-22001-020</td><td>Firm Sheeting</td><td>60</td><td>6" x 8" x .020" Gloss</td><td>each</td><td>$90.00</td><td><a href='http://grcht.tlyfy.servertrust.com/ShoppingCart.asp?ProductCode=SH-22001-020'>Add to Cart</a></td></tr><tr bgcolor="#CCFFFF"><td>SHS-22001-040</td><td>Firm Sheeting</td><td>60</td><td>4" x 6" x .040" Gloss</td><td>each</td><td>$60.00</td><td><a href='http://grcht.tlyfy.servertrust.com/ShoppingCart.asp?ProductCode=SHS-22001-040'>Add to Cart</a></td></tr><tr bgcolor="#FFFFCC"><td>SH-22001-040</td><td>Firm Sheeting</td><td>60</td><td>6" x 8" x .040" Gloss</td><td>each</td><td>$130.00</td><td><a href='http://grcht.tlyfy.servertrust.com/ShoppingCart.asp?ProductCode=SH-22001-040'>Add to Cart</a></td></tr><tr bgcolor="#CCFFFF"><td>SH-22001-080</td><td>Firm Sheeting</td><td>60</td><td>6" x 8" x .080" Gloss</td><td>each</td><td>$140.00</td><td><a href='http://grcht.tlyfy.servertrust.com/ShoppingCart.asp?ProductCode=SH-22001-080'>Add to Cart</a></td></tr><tr bgcolor="#FFFFCC"><td>SH-22001-120</td><td>Firm Sheeting</td><td>60</td><td>6" x 8" x .120" Gloss</td><td>each</td><td>$150.00</td><td><a href='http://grcht.tlyfy.servertrust.com/ShoppingCart.asp?ProductCode=SH-22001-120'>Add to Cart</a></td></tr></table> I would like to separate this out to a css sheet from all being within the html. How do i get the <tr> tag to alternate colors? Thanks! Link to comment Share on other sites More sharing options...
niche Posted January 1, 2014 Share Posted January 1, 2014 http://www.w3schools.com/css/css_id_class.asp Focus on the info concerning class. Link to comment Share on other sites More sharing options...
davej Posted January 2, 2014 Share Posted January 2, 2014 (edited) Note that you are using a lot of attributes that are depreciated or dropped in HTML5. You should try to not use these in new projects. http://www.w3schools.com/tags/tag_table.asp Edited January 2, 2014 by davej Link to comment Share on other sites More sharing options...
dsonesuk Posted January 2, 2014 Share Posted January 2, 2014 http://www.w3.org/Style/Examples/007/evenodd.en.html Link to comment Share on other sites More sharing options...
Safeer008 Posted January 22, 2014 Share Posted January 22, 2014 use tr:nth-of-type(odd){ background-color: #CCFFFF} and tr:nth-of-type(even){ background-color: #FFFFCC} Link to comment Share on other sites More sharing options...
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment
Create an account
Sign up for a new account in our community. It's easy!
Register a new accountSign in
Already have an account? Sign in here.
Sign In Now