Traditional table layout and CSS layout [original]

The traditional table layout method utilizes the zero border feature of all the table elements in HTML. When a table element is displayed, the cell border and spacing are set to 0, that is, the border is not displayed. Therefore, after dividing the elements in the webpage by layout, they are placed in cells of the table to achieve a complex typographical combination.

<Table width = 600 border = "1" cellspacing = "3" cellpadding = "3">
<Tr>
<TD width = "51%" rowspan = "2" background = "# 000fff"> <font color = "blue"> text display </font> </TD>
<TD width = "30%" background = "# 000fff"> & nbsp; </TD>
<TD width = "19%" background = "# 000fff"> & nbsp; </TD>
</Tr>
</Table>

Complex table design makes the design difficult and the modification more complex. In addition to the code of the table itself, the code generated for the webpage contains many redundant transparent GIF bitmaps and other elements, as a result, the download and resolution speed of the browser is slow.

CSS layout, using Div, div can be understood as a layer or a block. The DIV function is only used to mark a piece of information for later style definitions.

Currently, the popular Div + CSS, div considers data, CSS is responsible for style, easy to modify, and easy to operate.