css - 从 child 身上移除变换和透视。 not() 并重新指定不起作用

Question

https://jsfiddle.net/98uo6h2e/2/

所以我使用下面的代码制作了一个透视效果。我想排除 .hello2 仅使用 CSS 采用变换和/或透视效果。我该怎么做呢？

已经尝试将 transform & webkit 重新指定为 none/unset/initial in .hello nothing happened..

<table id="hello">
  <tbody>
    <tr>
      <td>
        <div class="hello2">
          <strong>Test</strong>
          <h2>Test2</h2>
        </div>
      </td>
    </tr>
  </tbody>
</table>


table#hello:not(.hello2) {
  -webkit-perspective-origin: center top;
  -webkit-perspective: 100;
}

tbody:not(.hello2) {
  transform: rotate3d(0.1, 0, 0, 40deg);
  -webkit-transform-origin: center top;
}

.hello2 {
  -webkit-transform-origin: initial;
  -webkit-perspective-origin: initial;
  -webkit-perspective: initial;
}

Answer 1

您可以使用:not 选择器。

table#hello:not(.hello2) {
    -webkit-perspective-origin: center top;
    -webkit-perspective: 100;
}
tbody:not(.hello2) {
    transform: rotate3d(0.1, 0, 0, 40deg); 
    -webkit-transform-origin: center top;
}