html - 如何在表格中的替代 td 中为右边框应用阴影效果

Question

如何为表格中的替代 tds 设置右阴影边框。 我正在尝试使用以下代码。在此阴影效果中有效。但是阴影效果会在每个 tds 连接中切入。任何人都可以帮助我吗？ 我的 table 是

<table class="myTable" style="padding: 2em;width: 100%;">
 <tr><th>subject</th>
     <th>name</th>   
     <th>mark1</th>
     <th>mark2</th>
     <th>total</th>
 </tr>
 <tr>
     <td>english</td>
     <td>abc</td>
     <td>10</td>
     <td>23</td>
     <td>33</td>
 </tr>
 <tr>
     <td>latin</td>
     <td>abc</td>
     <td>10</td>
     <td>23</td>
     <td>33</td>
 </tr>
 ........
</table>

我正在使用这段代码来实现阴影效果

table.myTable td:nth-child(even)
{
       box-shadow: 16px 3px 10px -7px #888, -10px 0px 20px -7px #888;
}

Answer 1

    <table class="myTable" style="padding: 2em;width: 100%;">
 <tr><th>subject</th>
     <th>name</th>   
     <th>mark1</th>
     <th>mark2</th>
     <th>total</th>
 </tr>
 <tr>
     <td style="box-shadow:16px 3px 10px">english</td>
     <td>abc</td>
     <td>10</td>
     <td>23</td>
     <td>33</td>
 </tr>
 <tr>
     <td>latin</td>
     <td>abc</td>
     <td>10</td>
     <td>23</td>
     <td>33</td>
 </tr>
 ........
</table>

应用到一个样式