css - 边框图像仅在一个边框上，而其他边框是实心的

Question

我使用边框图像在 TH 的左边框上创建渐变，但右边框必须是实心的。但是边框图像适用于所有边框，并且没有边框图像权限可以阻止它。我怎样才能解决这个问题？

<style>
TH {
    border-left:1px solid;
    -webkit-border-image:-webkit-linear-gradient(bottom, #BBB, rgba(255, 255, 255, 0)) 0 100%
    border-right:1px solid #CCC;
}
</style>

这是它现在的样子：

但它必须是这样的：

正如你现在看到的，右边框有一个渐变，但我希望它像第二张图片一样是实心的。

Answer 1

您为边框添加了渐变效果。代替它创建一个要用作边框的图像。
请参阅此链接并查看他们用来提供边框的原始图像。你会通过这样做得到你的输出。

Answer 2

您如何看待这样的黑客攻击：

<th style="width:104px; height:100px; background:url(up-down-gradient.png)">
  <div style="width:100px; height:100px; border-right:2px solid #888; margin-left:2px"></div>
</th>