使用css清除第二个表中的边框

Question

我在html页面上创建了两个表，我希望第一个表有一个边框，但我不希望第二个表有一个。如何让第二个表不在CSS中显示边框？

table, th, td {
    border: 1px solid black;
}

 th {
	background-color: #4B0082;
	color: white;
}


table {
    border-collapse: collapse;
}

<table style="width:100%">
  <tr>
      <tr>
          <td>table 1</td>
        <td>table 1</td> 
        <td><TABLE style="width:100%; border: none;">
    <TR>
               <TD>table 2</TD>
               <TD>table 2</TD>
              </TR>

               <TR>
               <TD>table 2</TD>
               <TD>table 2</TD>
               
    </TR>
       </TABLE></td>
 
    <td>table 1</td> 
    
  </tr>

Answer 1

这是我的代码 我给第二个表一个无边框的类名

<table class="no-border">...</table>

CSS：

.no-border td {border: none;}

Answer 2

虽然您的代码不是很清楚，但我添加了一个可能的答案希望它可以帮助您。使用id来唯一地识别表。

#t1 tr td  {

border:2px solid;
width:150px;
text-align:center;


}
#t2  {

/*border:2px solid; add border if you want to row*/
width:250px;

}

<TABLE id="t1">
           <TR>
           <TD>table 1</TD>
           <TD>table 1</TD>
           <TD>table 1</TD>
           <TD>table 1</TD>        
    </TR>
	<TR>
           <TD>table 1</TD>
           <TD>table 1</TD>
           <TD>table 1</TD>
           <TD>table 1</TD>        
    </TR>
	<TR>
           <TD>table 1</TD>
           <TD>table 1</TD>
           <TD>table 1</TD>
           <TD>table 1</TD>        
    </TR>
   </TABLE>

<br>
<TABLE id="t2">
           <TR>
           <TD>table 2</TD>
           <TD>table 2</TD>
           <TD>table 2</TD>
           <TD>table 2</TD>        
    </TR>
	<TR>
           <TD>table 2</TD>
           <TD>table 2</TD>
           <TD>table 2</TD>
           <TD>table 2</TD>        
    </TR>
	<TR>
           <TD>table 2</TD>
           <TD>table 2</TD>
           <TD>table 2</TD>
           <TD>table 2</TD>        
    </TR>
   </TABLE>

Answer 3

完全删除边框

<table cellspacing="0" cellpadding="0">

在css中：

表{border: none;}

删除表格单元格边框

表格{ border-collapse:collapse } 或

table {
  border-collapse: collapse;
}