Question

    <table border="1" cellpadding="0" cellspacing="0" style="border-collapse:collapse;">
                      <tr>
                        <td class="w25">1</td>
                        <td class="w25">2</td>
                        <td class="w25">3</td>
                        <td class="w25">4</td>
                      </tr>
                      <tr >
                        <td class="w25">5</td>
                        <td colspan="2" class="w50 noBorder">6</td>
                        <td class="w25">7</td>
                      </tr>
                      <tr class="">
                       <td class="w25">8</td>
                        <td colspan="2" class="w50 noBorder">9</td>
                        <td class="w25">10</td>
                      </tr>
                       <tr>
                        <td class="w25">11</td>
                        <td class="w25">12</td>
                        <td class="w25">13</td>
                        <td class="w25">14</td>
                      </tr>
                    </table>

我无法仅移除中间td，tr边框。我想显示这样的。所有12个侧箱尺寸应相同。请帮我用table或div显示。

--------------------------------------
|        |         |        |        |
|        |         |        |        |
|        |         |        |        |
|-------------------------------------
|        |                  |        |
|        |                  |        |
|        |                  |        |
----------                  ----------
|        |                  |        |
|        |                  |        | 
|        |                  |        |
--------------------------------------
|        |         |        |        |
|        |         |        |        |
|        |         |        |        |
--------------------------------------

Answer 1

而不是在td中定义表格元素border="1"上的边框，而您可以删除特定td上的边框，如下所示：

＆＃13;

#table1 td{
  border: 1px solid #000;
  }
#table1 td.noBorder{
  border: none;
  }

＆＃13;

<table id="table1" cellpadding="0" cellspacing="0" style="border-collapse:collapse;">
                      <tr>
                        <td class="w25">1</td>
                        <td class="w25">2</td>
                        <td class="w25">3</td>
                        <td class="w25">4</td>
                      </tr>
                      <tr >
                        <td class="w25">5</td>
                        <td colspan="2" class="w50 noBorder">6</td>
                        <td class="w25">7</td>
                      </tr>
                      <tr class="">
                       <td class="w25">8</td>
                        <td colspan="2" class="w50 noBorder">9</td>
                        <td class="w25">10</td>
                      </tr>
                       <tr>
                        <td class="w25">11</td>
                        <td class="w25">12</td>
                        <td class="w25">13</td>
                        <td class="w25">14</td>
                      </tr>
                    </table>

＆＃13;

Answer 2

只需使用此css

     <style type="text/css">
        td{
            border: solid 1px red;
        }
        .noBorder
        {
            border: 0px;
        }
    </style>

HTML Border Styles

如何删除HTML中的几个td边框

2 个答案: