How CSS implements only the internal borders are preserved:
In practical applications, there may be the need to keep only the internal borders of the table, it may not be a lot of demand, since there is such a requirement, as a programmer to implement such a function, the following share a piece of code that can implement this function.
The code is as follows:
<!DOCTYPE HTML><HTML><Head><MetaCharSet= "Utf-8"><Metaname= "Author"content= "http://www.51texiao.cn/" /><title>Ant Tribe</title><styletype= "Text/css">Table{Border-collapse:collapse;Border:0px solid #999; }Table TD{Border-top:0;Border-right:1px solid #999;Border-bottom:1px solid #999;Border-left:0; }Table Tr.lastrow TD{Border-bottom:0; }Table TR Td.lastcol{Border-right:0; } </style></Head><Body><Table> <TR> <TD>Ant Tribe One</TD> <TD>Ant Tribe II</TD> <TD>Ant Tribe Three</TD> <TD>Ant Tribe Four</TD> <TD>Ant Tribe Five</TD> <TDclass= "Lastcol">Ant Tribe VI</TD> </TR> <TR> <TD>Ant Tribe One</TD> <TD>Ant Tribe II</TD> <TD>Ant Tribe Three</TD> <TD>Ant Tribe Four</TD> <TD>Ant Tribe Five</TD> <TDclass= "Lastcol">Ant Tribe VI</TD> </TR> <TRclass= "LastRow"> <TD>Ant Tribe One</TD> <TD>Ant Tribe II</TD> <TD>Ant Tribe Three</TD> <TD>Ant Tribe Four</TD> <TD>Ant Tribe Five</TD> <TDclass= "Lastcol">Ant Tribe VI</TD> </TR></Table></Body></HTML>
The above code to achieve our requirements, the code is relatively simple, here is not more introduction, if there are any questions can be thread message.
Related reading:
The 1.border-collapse property can be found in the Border-collapse Properties section of CSS.
2.border properties can be found in the border property of CSS for a brief introduction to the section.
The original address is: http://www.51texiao.cn/HTML5jiaocheng/2015/0615/4368.html
The original address is: http://www.softwhy.com/forum.php?mod=viewthread&tid=13597
How CSS is implemented to keep only internal borders