Html 我可以缩短桌子边框的长度吗？

我在一张桌子上有

右边框

，我希望它从顶部和底部短一些像素，最好是

的80-90%高度，因为桌子不会保持不变

像这样：

这可能吗

table{
  border-right: 1px solid #f00; 
}

---

正如您所描述的，这是不可能的，因为元素的

边框（根据定义）延伸到整个边框周围。但是，您可以使用嵌套元素或CSS生成的内容在某种程度上伪造它

例如，使用以下HTML：

<table>
    <tbody>
        <tr>
            <td>text in cell</td>
        </tr>
    </tbody>
</table>

<table>
    <tbody>
        <tr>
            <td>text in cell<div></div></td>
        </tr>
    </tbody>
</table>


不幸的是，要在电子邮件客户机中使用它，就需要一个嵌套元素（即使是现在，电子邮件客户机的容量也非常原始）。因此，以下HTML：

<table>
    <tbody>
        <tr>
            <td>text in cell</td>
        </tr>
    </tbody>
</table>

<table>
    <tbody>
        <tr>
            <td>text in cell<div></div></td>
        </tr>
    </tbody>
</table>

.
可以接受附加标记吗


可以使用伪元素执行此操作：

table {
    position: relative;
}

table:after {
    position: absolute;
    border-right: 1px solid #f00; 
    content: "";
    top: 5%;
    bottom: 5%;
    right: -1px;
}

示例：
那么，什么才是实现这一目标的最好、最干净的方法？@Adsy：查看更新的答案，在发布解释后正在研究这个问题。=）啊，伙计，这段代码在浏览器视图中工作得很好，但当我在Outlook中查看它时，它就消失了！：（啊，如果您是在电子邮件客户端中执行此操作，那么恐怕您需要重新使用嵌套元素。请参阅更新的答案。就是这样：）谢谢您的所有工作！如果将
表格：在
的样式之后更改为
顶部：5%；底部：5%；右：0然后你将得到op想要的东西+1谢谢你@AlexShesterov
table{
  border-right: 1px solid #f00; 
}

#wrapper {
    background: #eee0e0;
    padding: 20px 0;
    display: table; /* necessary for shirnk wrapping (inline-block would also work)
}

table {
    position: relative;
}

table:after {
    position: absolute;
    border-right: 1px solid #f00; 
    content: "";
    top: 5%;
    bottom: 5%;
    right: -1px;
}