A thin border table instance in DW that implements a 1px pixel

We have recently used tables to implement the following

Making a thin border table with 1 pixels in a Web page seems like a very simple thing to do. Set table borders after inserting a table directly boder=1? The friend who has tried must know that by setting a border of 1 pixels out of the table border line is very thick, not the desired thin border effect, then this thin border how to do? This requires a certain skill.

Let's take a look at the table effect with a border of 1 pixels:

From the effect above, it's not the thin border effect we want, the 1-pixel border is a bit too thick, and if the border color is set to black it's more obvious, and most of the time we need a real pixel border effect. Here's how to do this:

1, create a real size of the table, set the table border is 0, table spacing is 1, fill to 0, the table background color set to the desired border color, namely: border= "0″cellpadding=" 0″cellspacing= "1″bgcolor=" # CCCCCC ", as shown in figure:

2, select the cell label <td>, set the cell background color to pure white #ffffff, save the preview to get the thin border effect of the following figure, the true 1 pixel border , look the effect and directly set the border of 1 completely fresher.

Of course the individual does not recommend the use of tables, we use CSS Div will be very simple

The code is as follows	Copy Code
<style> . div{border:1px solid #ccc;} </style> <div class= ' div ' ></div>

The result is the same, but it will be simpler to maintain in code DIV+CSS mode is more simple than table mode.