GitHub Pages Jekyll无法覆写主题CSS 移除自定义表格边框

你之前的样式只给<table>标签设置了边框属性，完全没命中真正产生边框的元素：绝大多数Jekyll主题的表格边框都是直接定义在th、td单元格上的。
再加上市面主流Jekyll主题的表格样式选择器都是.main-content table td这种带父级限定的写法，选择器权重高于你写的.portfolio-table td，所以哪怕你加了!important，如果没写对父级匹配、没选中真正加边框的元素，一样不会生效。

把下面这段CSS添加到你自定义样式文件的最后一行（保证它在主题默认CSS之后加载，优先级更高）：

/* 覆盖主题表格边框样式 */
.main-content .portfolio-table,
.main-content .portfolio-table tbody,
.main-content .portfolio-table tr,
.main-content .portfolio-table th,
.main-content .portfolio-table td {
  border: 0 !important;
  border-collapse: collapse;
  outline: 0 !important;
  box-shadow: none !important;
}

• 带上.main-content父选择器，和主题样式的选择器权重对齐，再配合!important可以完全覆盖原有边框规则
• 把table、tbody、tr、th、td所有表格相关元素都纳入匹配，不管主题把边框加在哪一层都能覆盖
• 额外加了box-shadow: none是为了兼容部分主题不用border、改用阴影模拟表格边框的情况
• border-collapse: collapse 用来消除单元格之间的默认间隙，避免被误判成残留边框

加完样式之后，删掉你之前写在<table>标签上的内联样式style="border: 0px transparent #ffffff;"，这个样式只作用于table标签本身，对单元格边框完全无效，留着没有意义。

如果改完还是有类似边框的线条，直接按F12打开浏览器开发者工具，用元素选择器点中有线的位置，看右侧「计算后样式」面板，找到对应产生线条的CSS属性（大概率是background、box-shadow或者某一方向的border没覆盖到），对应补到上面的CSS规则里即可。

内容的提问来源于stack exchange，提问作者Evan Voordeckers