HTML中的多个表创建

时间：2015-11-06 05:49:49

标签： html css

与这段代码混淆了..我想在这些优惠显示之间显示寄宿生.. 这是我的代码。任何一次更改此代码，对于打印寄宿生。

＆＃13;
＆＃13; 
<div dir="ltr" style="text-align: left;" trbidi="on">
  <html>


  <!-- Heading-->
  <table align="center" border="0" bordercolor="red">
    <th>Today's Best Offers</th>
  </table>


  <!---------------------1 Row Start------------------------>
  <!-- 1 Row - Title-->
  <table align="center" border="0" bordercolor="red" style="width: 750px;">
    <tr>
      <th align="center" colspan="0" width="150">50% off Mobiles</th>
      <th align="center" colspan="0" width="150">10% off All Items</th>
      <th align="center" colspan="0" width="150">Buy 1 Get 1</th>
      <th align="center" colspan="0" width="150">1 Month Free Trail</th>
      <th align="center" colspan="0" width="150">100% Cashback Sale at 10:00 Today</th>
    </tr>
  </table>



  <!-- 1 Row - Images-->
  <table align="center" border="0" bordercolor="red" style="width: 750px;">
    <tr>
      <td align="center" colspan="0" width="150">
        <img alt="" border="0" height="50" src="http://1.bp.blogspot.com/-Oi7zd5vQ2s0/VjwOFwz_ccI/AAAAAAAAB9Y/llS-eFGHvJU/s1600/cb139.jpg" width="100" />
      </td>
      <td align="center" colspan="0" width="150">
        <img alt="" border="0" height="50" src="http://3.bp.blogspot.com/-NA3eaDSRjfw/VjwOF0Eot0I/AAAAAAAAB9c/2Clk6u9V33E/s1600/cb2078.jpg" width="100" />
      </td>
      <td align="center" colspan="0" width="150">
        <img alt="" border="0" height="50" src="http://4.bp.blogspot.com/-0urM6uQDurw/VjwOFwlcZAI/AAAAAAAAB9g/2V2SiROTg8s/s1600/cb3163.jpg" width="100" />
      </td>
      <td align="center" colspan="0" width="150">
        <img alt="" border="0" height="50" src="http://3.bp.blogspot.com/-KPaBffK5etY/VjwOGtyGZqI/AAAAAAAAB9k/bszuCeVPvgg/s1600/cb3252.jpg" width="100" />
      </td>
      <td align="center" colspan="0" width="150">
        <img alt="" border="0" height="50" src="http://1.bp.blogspot.com/-gHSVTx9_u1Y/VjwOG5PfuFI/AAAAAAAAB9o/nOzZYsuL6gU/s1600/cb3300.jpg" width="100" />
      </td>
    </tr>
  </table>



  <!-- 1 Row - Offer Details-->
  <table align="center" border="0" bordercolor="red" style="width: 750px;">
    <tr>
      <th align="center" colspan="0" width="150">Offer: Now get 50% discount on all mobiles at amazon</th>
      <th align="center" colspan="0" width="150">Offer: Now get 50% discount on all mobiles at amazon</th>
      <th align="center" colspan="0" width="150">Now get 50% discount on all mobiles at amazon</th>
      <th align="center" colspan="0" width="150">Now get 50% discount on all mobiles at amazon</th>
      <th align="center" colspan="0" width="150">Now get 50% discount on all mobiles at amazon</th>
    </tr>
  </table>


  <!-- 1 Row - Offer Validity Details-->
  <table align="center" border="0" bordercolor="red" style="width: 750px;">
    <tr>
      <th align="left" colspan="0" width="150">Validity: 11.11.2015</th>
      <th align="left" colspan="0" width="150">Validity: 11.11.2015</th>
      <th align="left" colspan="0" width="150">Validity: 11.11.2015</th>
      <th align="left" colspan="0" width="150">Validity: 11.11.2015</th>
      <th align="left" colspan="0" width="150">Validity: 11.11.2015</th>
    </tr>
  </table>



  <!-- 1 Row - Click Button Images-->
  <table align="center" border="0" bordercolor="red" style="width: 750px;">
    <tr>
      <td align="center" colspan="0" width="150">
        <img alt="" border="1" height="35" src="http://2.bp.blogspot.com/-w8VC-p0TXT8/VjwosiKtMKI/AAAAAAAAB-Y/2VDB5LRdU98/s1600/Selection_020.png" width="100" />
      </td>
      <td align="center" colspan="0" width="150">
        <img alt="" border="1" height="35" src="http://2.bp.blogspot.com/-w8VC-p0TXT8/VjwosiKtMKI/AAAAAAAAB-Y/2VDB5LRdU98/s1600/Selection_020.png" width="100" />
      </td>
      <td align="center" colspan="0" width="150">
        <img alt="" border="1" height="35" src="http://1.bp.blogspot.com/-g6SFLkUMW-Y/Vjwosl2DPCI/AAAAAAAAB-c/0lPXmadTFbs/s1600/Selection_021.png" width="100" />
      </td>
      <td align="center" colspan="0" width="150">
        <img alt="" border="1" height="35" src="http://1.bp.blogspot.com/-g6SFLkUMW-Y/Vjwosl2DPCI/AAAAAAAAB-c/0lPXmadTFbs/s1600/Selection_021.png" width="100" />
      </td>
      <td align="center" colspan="0" width="150">
        <img alt="" border="1" height="35" src="http://2.bp.blogspot.com/-w8VC-p0TXT8/VjwosiKtMKI/AAAAAAAAB-Y/2VDB5LRdU98/s1600/Selection_020.png" width="100" />
      </td>
    </tr>
  </table>

  <!---------------------1 Row End----------------------->



  <!---------------------2 Row Start------------------------>
  <!-- 1 Row - Title-->
  <table align="center" border="0" bordercolor="red" style="width: 750px;">
    <tr>
      <th align="center" colspan="0" width="150">50% off Mobiles</th>
      <th align="center" colspan="0" width="150">10% off All Items</th>
      <th align="center" colspan="0" width="150">Buy 1 Get 1</th>
      <th align="center" colspan="0" width="150">1 Month Free Trail</th>
      <th align="center" colspan="0" width="150">100% Cashback Sale at 10:00 Today</th>
    </tr>
  </table>



  <!-- 1 Row - Images-->
  <table align="center" border="0" bordercolor="red" style="width: 750px;">
    <tr>
      <td align="center" colspan="0" width="150">
        <img alt="" border="0" height="50" src="http://1.bp.blogspot.com/-Oi7zd5vQ2s0/VjwOFwz_ccI/AAAAAAAAB9Y/llS-eFGHvJU/s1600/cb139.jpg" width="100" />
      </td>
      <td align="center" colspan="0" width="150">
        <img alt="" border="0" height="50" src="http://3.bp.blogspot.com/-NA3eaDSRjfw/VjwOF0Eot0I/AAAAAAAAB9c/2Clk6u9V33E/s1600/cb2078.jpg" width="100" />
      </td>
      <td align="center" colspan="0" width="150">
        <img alt="" border="0" height="50" src="http://4.bp.blogspot.com/-0urM6uQDurw/VjwOFwlcZAI/AAAAAAAAB9g/2V2SiROTg8s/s1600/cb3163.jpg" width="100" />
      </td>
      <td align="center" colspan="0" width="150">
        <img alt="" border="0" height="50" src="http://3.bp.blogspot.com/-KPaBffK5etY/VjwOGtyGZqI/AAAAAAAAB9k/bszuCeVPvgg/s1600/cb3252.jpg" width="100" />
      </td>
      <td align="center" colspan="0" width="150">
        <img alt="" border="0" height="50" src="http://1.bp.blogspot.com/-gHSVTx9_u1Y/VjwOG5PfuFI/AAAAAAAAB9o/nOzZYsuL6gU/s1600/cb3300.jpg" width="100" />
      </td>
    </tr>
  </table>



  <!-- 1 Row - Offer Details-->
  <table align="center" border="0" bordercolor="red" style="width: 750px;">
    <tr>
      <th align="center" colspan="0" width="150">Offer: Now get 50% discount on all mobiles at amazon</th>
      <th align="center" colspan="0" width="150">Offer: Now get 50% discount on all mobiles at amazon</th>
      <th align="center" colspan="0" width="150">Now get 50% discount on all mobiles at amazon</th>
      <th align="center" colspan="0" width="150">Now get 50% discount on all mobiles at amazon</th>
      <th align="center" colspan="0" width="150">Now get 50% discount on all mobiles at amazon</th>
    </tr>
  </table>


  <!-- 1 Row - Offer Validity Details-->
  <table align="center" border="0" bordercolor="red" style="width: 750px;">
    <tr>
      <th align="left" colspan="0" width="150">Validity: 11.11.2015</th>
      <th align="left" colspan="0" width="150">Validity: 11.11.2015</th>
      <th align="left" colspan="0" width="150">Validity: 11.11.2015</th>
      <th align="left" colspan="0" width="150">Validity: 11.11.2015</th>
      <th align="left" colspan="0" width="150">Validity: 11.11.2015</th>
    </tr>
  </table>



  <!-- 1 Row - Click Button Images-->
  <table align="center" border="0" bordercolor="red" style="width: 750px;">
    <tr>
      <td align="center" colspan="0" width="150">
        <img alt="" border="1" height="35" src="http://2.bp.blogspot.com/-w8VC-p0TXT8/VjwosiKtMKI/AAAAAAAAB-Y/2VDB5LRdU98/s1600/Selection_020.png" width="100" />
      </td>
      <td align="center" colspan="0" width="150">
        <img alt="" border="1" height="35" src="http://2.bp.blogspot.com/-w8VC-p0TXT8/VjwosiKtMKI/AAAAAAAAB-Y/2VDB5LRdU98/s1600/Selection_020.png" width="100" />
      </td>
      <td align="center" colspan="0" width="150">
        <img alt="" border="1" height="35" src="http://1.bp.blogspot.com/-g6SFLkUMW-Y/Vjwosl2DPCI/AAAAAAAAB-c/0lPXmadTFbs/s1600/Selection_021.png" width="100" />
      </td>
      <td align="center" colspan="0" width="150">
        <img alt="" border="1" height="35" src="http://1.bp.blogspot.com/-g6SFLkUMW-Y/Vjwosl2DPCI/AAAAAAAAB-c/0lPXmadTFbs/s1600/Selection_021.png" width="100" />
      </td>
      <td align="center" colspan="0" width="150">
        <img alt="" border="1" height="35" src="http://2.bp.blogspot.com/-w8VC-p0TXT8/VjwosiKtMKI/AAAAAAAAB-Y/2VDB5LRdU98/s1600/Selection_020.png" width="100" />
      </td>
    </tr>
  </table>

  <!---------------------2 Row End----------------------->





  </html>
  <html>

  </html>
</div>
＆＃13;
＆＃13;
＆＃13;

请修改代码......给我一个新代码..

2 个答案:

答案 0 :(得分：0)

尝试添加此CSS代码：

<style>
table { border: none; border-collapse: collapse; }
table td, table th { border-left: 1px solid #000; }
table td:first-child, th:first-child { border-left: none; }
</style>

除了第一个单元格之外，此CSS将在每个单元格的左侧添加边框（即“td”或“th”）。你可以根据需要添加/编辑css样式，如margin，color，.......

答案 1 :(得分：0)

试试这个css 

table:first-child th{
  border:none;
}
table {
  border-collapse: collapse;
}
table tr th, table tr td{
    table-layout: fixed;
    box-sizing:border-box;
	border: 1px solid #4d4d4d;
    border-bottom:none;
    box-sizing:border-box;
}
table:last-child tr th, table:last-child tr td{
    border-bottom:1px solid #4d4d4d;
}
<div dir="ltr" style="text-align: left;" trbidi="on">
  <html>


  <!-- Heading-->
  <table align="center" border="0" bordercolor="red">
    <th>Today's Best Offers</th>
  </table>


  <!---------------------1 Row Start------------------------>
  <!-- 1 Row - Title-->
  <table align="center" border="0" bordercolor="red" style="width: 750px;">
    <tr>
      <th align="center" colspan="0" width="150">50% off Mobiles</th>
      <th align="center" colspan="0" width="150">10% off All Items</th>
      <th align="center" colspan="0" width="150">Buy 1 Get 1</th>
      <th align="center" colspan="0" width="150">1 Month Free Trail</th>
      <th align="center" colspan="0" width="150">100% Cashback Sale at 10:00 Today</th>
    </tr>
  </table>



  <!-- 1 Row - Images-->
  <table align="center" border="0" bordercolor="red" style="width: 750px;">
    <tr>
      <td align="center" colspan="0" width="150">
        <img alt="" border="0" height="50" src="http://1.bp.blogspot.com/-Oi7zd5vQ2s0/VjwOFwz_ccI/AAAAAAAAB9Y/llS-eFGHvJU/s1600/cb139.jpg" width="100" />
      </td>
      <td align="center" colspan="0" width="150">
        <img alt="" border="0" height="50" src="http://3.bp.blogspot.com/-NA3eaDSRjfw/VjwOF0Eot0I/AAAAAAAAB9c/2Clk6u9V33E/s1600/cb2078.jpg" width="100" />
      </td>
      <td align="center" colspan="0" width="150">
        <img alt="" border="0" height="50" src="http://4.bp.blogspot.com/-0urM6uQDurw/VjwOFwlcZAI/AAAAAAAAB9g/2V2SiROTg8s/s1600/cb3163.jpg" width="100" />
      </td>
      <td align="center" colspan="0" width="150">
        <img alt="" border="0" height="50" src="http://3.bp.blogspot.com/-KPaBffK5etY/VjwOGtyGZqI/AAAAAAAAB9k/bszuCeVPvgg/s1600/cb3252.jpg" width="100" />
      </td>
      <td align="center" colspan="0" width="150">
        <img alt="" border="0" height="50" src="http://1.bp.blogspot.com/-gHSVTx9_u1Y/VjwOG5PfuFI/AAAAAAAAB9o/nOzZYsuL6gU/s1600/cb3300.jpg" width="100" />
      </td>
    </tr>
  </table>



  <!-- 1 Row - Offer Details-->
  <table align="center" border="0" bordercolor="red" style="width: 750px;">
    <tr>
      <th align="center" colspan="0" width="150">Offer: Now get 50% discount on all mobiles at amazon</th>
      <th align="center" colspan="0" width="150">Offer: Now get 50% discount on all mobiles at amazon</th>
      <th align="center" colspan="0" width="150">Now get 50% discount on all mobiles at amazon</th>
      <th align="center" colspan="0" width="150">Now get 50% discount on all mobiles at amazon</th>
      <th align="center" colspan="0" width="150">Now get 50% discount on all mobiles at amazon</th>
    </tr>
  </table>


  <!-- 1 Row - Offer Validity Details-->
  <table align="center" border="0" bordercolor="red" style="width: 750px;">
    <tr>
      <th align="left" colspan="0" width="150">Validity: 11.11.2015</th>
      <th align="left" colspan="0" width="150">Validity: 11.11.2015</th>
      <th align="left" colspan="0" width="150">Validity: 11.11.2015</th>
      <th align="left" colspan="0" width="150">Validity: 11.11.2015</th>
      <th align="left" colspan="0" width="150">Validity: 11.11.2015</th>
    </tr>
  </table>



  <!-- 1 Row - Click Button Images-->
  <table align="center" border="0" bordercolor="red" style="width: 750px;">
    <tr>
      <td align="center" colspan="0" width="150">
        <img alt="" border="1" height="35" src="http://2.bp.blogspot.com/-w8VC-p0TXT8/VjwosiKtMKI/AAAAAAAAB-Y/2VDB5LRdU98/s1600/Selection_020.png" width="100" />
      </td>
      <td align="center" colspan="0" width="150">
        <img alt="" border="1" height="35" src="http://2.bp.blogspot.com/-w8VC-p0TXT8/VjwosiKtMKI/AAAAAAAAB-Y/2VDB5LRdU98/s1600/Selection_020.png" width="100" />
      </td>
      <td align="center" colspan="0" width="150">
        <img alt="" border="1" height="35" src="http://1.bp.blogspot.com/-g6SFLkUMW-Y/Vjwosl2DPCI/AAAAAAAAB-c/0lPXmadTFbs/s1600/Selection_021.png" width="100" />
      </td>
      <td align="center" colspan="0" width="150">
        <img alt="" border="1" height="35" src="http://1.bp.blogspot.com/-g6SFLkUMW-Y/Vjwosl2DPCI/AAAAAAAAB-c/0lPXmadTFbs/s1600/Selection_021.png" width="100" />
      </td>
      <td align="center" colspan="0" width="150">
        <img alt="" border="1" height="35" src="http://2.bp.blogspot.com/-w8VC-p0TXT8/VjwosiKtMKI/AAAAAAAAB-Y/2VDB5LRdU98/s1600/Selection_020.png" width="100" />
      </td>
    </tr>
  </table>

  <!---------------------1 Row End----------------------->



  <!---------------------2 Row Start------------------------>
  <!-- 1 Row - Title-->
  <table align="center" border="0" bordercolor="red" style="width: 750px;">
    <tr>
      <th align="center" colspan="0" width="150">50% off Mobiles</th>
      <th align="center" colspan="0" width="150">10% off All Items</th>
      <th align="center" colspan="0" width="150">Buy 1 Get 1</th>
      <th align="center" colspan="0" width="150">1 Month Free Trail</th>
      <th align="center" colspan="0" width="150">100% Cashback Sale at 10:00 Today</th>
    </tr>
  </table>



  <!-- 1 Row - Images-->
  <table align="center" border="0" bordercolor="red" style="width: 750px;">
    <tr>
      <td align="center" colspan="0" width="150">
        <img alt="" border="0" height="50" src="http://1.bp.blogspot.com/-Oi7zd5vQ2s0/VjwOFwz_ccI/AAAAAAAAB9Y/llS-eFGHvJU/s1600/cb139.jpg" width="100" />
      </td>
      <td align="center" colspan="0" width="150">
        <img alt="" border="0" height="50" src="http://3.bp.blogspot.com/-NA3eaDSRjfw/VjwOF0Eot0I/AAAAAAAAB9c/2Clk6u9V33E/s1600/cb2078.jpg" width="100" />
      </td>
      <td align="center" colspan="0" width="150">
        <img alt="" border="0" height="50" src="http://4.bp.blogspot.com/-0urM6uQDurw/VjwOFwlcZAI/AAAAAAAAB9g/2V2SiROTg8s/s1600/cb3163.jpg" width="100" />
      </td>
      <td align="center" colspan="0" width="150">
        <img alt="" border="0" height="50" src="http://3.bp.blogspot.com/-KPaBffK5etY/VjwOGtyGZqI/AAAAAAAAB9k/bszuCeVPvgg/s1600/cb3252.jpg" width="100" />
      </td>
      <td align="center" colspan="0" width="150">
        <img alt="" border="0" height="50" src="http://1.bp.blogspot.com/-gHSVTx9_u1Y/VjwOG5PfuFI/AAAAAAAAB9o/nOzZYsuL6gU/s1600/cb3300.jpg" width="100" />
      </td>
    </tr>
  </table>



  <!-- 1 Row - Offer Details-->
  <table align="center" border="0" bordercolor="red" style="width: 750px;">
    <tr>
      <th align="center" colspan="0" width="150">Offer: Now get 50% discount on all mobiles at amazon</th>
      <th align="center" colspan="0" width="150">Offer: Now get 50% discount on all mobiles at amazon</th>
      <th align="center" colspan="0" width="150">Now get 50% discount on all mobiles at amazon</th>
      <th align="center" colspan="0" width="150">Now get 50% discount on all mobiles at amazon</th>
      <th align="center" colspan="0" width="150">Now get 50% discount on all mobiles at amazon</th>
    </tr>
  </table>


  <!-- 1 Row - Offer Validity Details-->
  <table align="center" border="0" bordercolor="red" style="width: 750px;">
    <tr>
      <th align="left" colspan="0" width="150">Validity: 11.11.2015</th>
      <th align="left" colspan="0" width="150">Validity: 11.11.2015</th>
      <th align="left" colspan="0" width="150">Validity: 11.11.2015</th>
      <th align="left" colspan="0" width="150">Validity: 11.11.2015</th>
      <th align="left" colspan="0" width="150">Validity: 11.11.2015</th>
    </tr>
  </table>



  <!-- 1 Row - Click Button Images-->
  <table align="center" border="0" bordercolor="red" style="width: 750px;">
    <tr>
      <td align="center" colspan="0" width="150">
        <img alt="" border="1" height="35" src="http://2.bp.blogspot.com/-w8VC-p0TXT8/VjwosiKtMKI/AAAAAAAAB-Y/2VDB5LRdU98/s1600/Selection_020.png" width="100" />
      </td>
      <td align="center" colspan="0" width="150">
        <img alt="" border="1" height="35" src="http://2.bp.blogspot.com/-w8VC-p0TXT8/VjwosiKtMKI/AAAAAAAAB-Y/2VDB5LRdU98/s1600/Selection_020.png" width="100" />
      </td>
      <td align="center" colspan="0" width="150">
        <img alt="" border="1" height="35" src="http://1.bp.blogspot.com/-g6SFLkUMW-Y/Vjwosl2DPCI/AAAAAAAAB-c/0lPXmadTFbs/s1600/Selection_021.png" width="100" />
      </td>
      <td align="center" colspan="0" width="150">
        <img alt="" border="1" height="35" src="http://1.bp.blogspot.com/-g6SFLkUMW-Y/Vjwosl2DPCI/AAAAAAAAB-c/0lPXmadTFbs/s1600/Selection_021.png" width="100" />
      </td>
      <td align="center" colspan="0" width="150">
        <img alt="" border="1" height="35" src="http://2.bp.blogspot.com/-w8VC-p0TXT8/VjwosiKtMKI/AAAAAAAAB-Y/2VDB5LRdU98/s1600/Selection_020.png" width="100" />
      </td>
    </tr>
  </table>

  <!---------------------2 Row End----------------------->





  </html>
  <html>

  </html>
</div>

相关问题
最新问题