How to remove td border using html?

Question

HTML

<table border="1"> <tr> <td>one</td> <td>two</td> </tr> <tr> <td>one</td> <td>two</td> </tr> </table> 

It draws boundaries like this

 +---+---+ | | | +---+---+ | | | +---+---+ 

But I would like to display the frame in the table just not for td, like this

 +--------+ | | | | | | +--------+ 

How can I do this with html markup. (NO CSS / NO INLINE STYLES)

In some cases, I need to remove only some td borders and some td border in order to display something like this:

 +---+---+ | | | +---+ | | | | +---+---+ 

Answer 1

A simple solution from my end is to save another table with a border and insert the table into an external table.

 <table border="1"> <tr> <td> <table border="0"> <tr> <td>one</td> <td>two</td> </tr> <tr> <td>one</td> <td>two</td> </tr> </table> </td> </tr> </table> 

Answer 2

Dip it in a div and give it a border and remove the border from the table

 <div style="border: 1px solid black"> <table border="0"> <tr> <td>one</td> <td>two</td> </tr> <tr> <td>one</td> <td>two</td> </tr> </table> </div> 

Here you can check the working script

---

According to your updated question .... where do you want to add or remove borders. First you need to remove the borders from the html table, and then do the following

 <td style="border-top: 1px solid black"> 

Assuming you only need the upper bound. Similarly, you must do for others. Best way to create four css classes ...

 .topBorderOnly { border-top: 1px solid black; } .bottomBorderOnly { border-bottom: 1px solid black; } 

Then add css to your code depending on your requirements.

 <td class="topBorderOnly bottomBorderOnly"> 

This will add upper and lower bounds, similarly do for the rest.

Answer 3

First

 <table border="1"> <tr> <td style='border-right:none;border-left:none;border-bottom:none;border-top:none'>one</td> <td style='border-right:none;border-left:none;border-bottom:none;border-top:none'>two</td> </tr> <tr> <td style='border-right:none;border-left:none;border-bottom:none;border-top:none'>one</td> <td style='border-right:none;border-left:none;border-bottom:none;border-top:none'>two</td> </tr> </table> 

Second example

 <table border="1" cellspacing="0" cellpadding="0"> <tr> <td style='border-left:none;border-top:none'>one</td> <td style='border-right:none;border-left:none;border-bottom:none;border-top:none'>two</td> </tr> <tr> <td style='border-left:none;border-bottom:none;border-top:none'>one</td> <td style='border-right:none;border-left:none;border-bottom:none;border-top:none'>two</td> </tr> </table> 

Answer 4

To remove borders between cells while maintaining a border around the table, add the rules=none attribute to the table tag.

There is no way in HTML to achieve the rendering indicated in the last question of the question. There are various complex workarounds based on using some other markup structure.

Answer 5

Try:

 <table border="1"> <tr> <td> <table border=""> ... </table> </td> </tr> </table> 

Answer 6

 <table border="1" cellspacing="0" cellpadding="0"> <tr> <td> <table border="0"> <tr> <td>one</td> <td>two</td> </tr> <tr> <td>one</td> </tr> </table> </td> </tr> </table>