css - 仅使用内联 css 处理表格中的单元格边框

Question

我需要更改我构建的表格的边框属性，但我在内容管理系统后面操作，该系统不允许我编辑样式表，只能编辑页面的 HTML。

所以我可以使用 <table style="...."> 来操作一些表属性, 但是当我使用 border属性它只影响外边框，而不影响单个单元格之间存在的边框。

显然我可以将 HTML 规则添加到 <table>标签即 <table border="1px">但这些不会覆盖影响边框的外部样式表，因此我需要一个内联 CSS 解决方案。

真正更改单元格间边框的唯一方法是为每个 td 手动添加边框属性还是我错过了什么？

感谢您的帮助，

Answer 1

我还没有找到真正的内联解决方案，但是 scoped HTML5 属性非常接近。

特别是，有了这个特性，您不必为表发明一个新的 ID/类，并希望它不会与其他任何东西发生冲突。

例子:

<table>
    <style scoped>td {padding:1px;}</style>
    <tr>
        <td>0</td>
        <td>1</td>
    </tr>
</table>

不幸的是，在撰写本文时，它仅受 Firefox 支持。

编辑 2019:后来在采用之前放弃的功能:https://developer.mozilla.org/en-US/docs/Web/API/HTMLStyleElement/scoped现在标记为“过时”