Question

我在另一个表中有这个表，我想从子表的单元格（A和B周围）中删除边框。以下是此源代码。

    <style>
    .withBorders tr td{
       border: 1px solid black !important ;
    }
    .withBorders table.withoutBorders tr td {
       border:0px
    }
    </style>

    <table class="withBorders">
      <tr>
        <td>
          <table class="withoutBorders">
            <tbody>
              <tr>
                <td>A</td>
                <td>B</td>
              </tr>
            </tbody>
          </table>
        </td>
        <td>C</td>
      </tr>
      <tr>
        <td>D</td>
        <td>E</td>
      </tr>
    </table>

问题是这个没有用，我用子表的css选择器尝试了很多更改，但是我无法覆盖父表css属性。

有人可以就此提出建议吗？注意：我无法对父表css选择器进行任何更改。

Answer 1

＆＃13;

    .withBorders tr td{
       border: 1px solid black;
    }
    .withBorders tr td table tr td {
       border:none;
    }

＆＃13;

    <table class="withBorders">
      <tr>
        <td>
          <table class="withoutBorders">
            <tbody>
              <tr>
                <td>A</td>
                <td>B</td>
              </tr>
            </tbody>
          </table>
        </td>
        <td>C</td>
      </tr>
      <tr>
        <td>D</td>
        <td>E</td>
      </tr>
    </table>

＆＃13;

重复您键入的内容，不要像这样更改您的输入

.withBorders table.withoutBorders tr td {
   border:0px
}

avaoid！在你的CSS很重要。它不好。

Answer 2

您可以轻松使用以下代码：

＆＃13;

.withBorders tr td{
   border: 1px solid black;
}
.withBorders table.withoutBorders tr td {
   border:0px
}

＆＃13;

<table class="withBorders">
  <tr>
    <td>
      <table class="withoutBorders">
        <tbody>
          <tr>
            <td>A</td>
            <td>B</td>
          </tr>
        </tbody>
      </table>
    </td>
    <td>C</td>
  </tr>
  <tr>
    <td>D</td>
    <td>E</td>
  </tr>
</table>

＆＃13;

＆＃34;！重要＆＃34;意味着如果它是两种样式之间的某种选择，它将选择具有更高优先级的样式。（包含＆＃34;！important＆＃34;）的风格

删除单元格内的表格边框

2 个答案: