Comparison of effects of using CSS and table code to achieve alternating colors of each line

Use CSS to write the effect of alternating colors on each row of the table
CSS is used to show the different colors of each row in a table. It is used to differentiate each row of data for easy reading. Some of them use the BUG of IE to add dynamic content in CSS. IE will parse it. This will not be discussed first, because it has nothing to do with the topic.
We can also see a few simple ways to use different labels for different background colors to achieve the effect. First look at the CSS of this method.

The code is as follows:	Copy code
Th {font-weight: normal; text-align: left; background: # CCCCCC} Td {background: # FAFAFA} Page code <Table> <Tr> <Th> First Color </th> </Tr> <Tr> <Td> Second Color </td> </Tr> <Tr> <Th> First Color </th> </Tr> <Tr> <Td> Second Color </td> </Tr> <Tr> <Th> First Color </th> </Tr> <Tr> <Td> Second Color </td> </Tr> </Table>

Use td and th to give different background colors to achieve the effect. However, each tag has its own special meaning. If you use this method to separate data for easy viewing, th loses its original meaning. th indicates the topic of a column, here, it is only used to assign a different background color to each row of the table.
The most important thing about web standardization is tag semantics. Here we just want to say that this method is really clever and easy to use, but it violates the most basic thing of standardization. If you don't care, you can use it in this way, or even pass verification.
I will certainly mention a lot about the semantic content in the future. I just happened to see it here, and then I started my head.
Changes the background color or image when the mouse passes
It can be used for table td or div, similar to IBM effect
Change the background color when the mouse passes

The code is as follows:	Copy code
<Table> <tr> <td width = "100" height = "100" onmouseover = "style. backgroundColor = '# c86f70' "onmouseout =" style. backgroundColor = '# DDC676' "bgcolor =" # DDC676 "> ihandu </td> </tr> </table>

Change the background image when the mouse passes

The code is as follows:	Copy code
<Table> <tr> <td width = "100" height = "100" onMouseOver = "this. background = '/images/1.gif'; "onMouseOut =" this. background = '/images/2.gif'; "background ="/images/2.gif"> ihandu </td> </tr> </table>