HTML表格实现所有行贯通左侧边框 无CSS方案及异常排查

问题定位 #

• 原样式border-left: 1px solid #000错加在rowspan="4"的<td>内部的<p>标签上，而非<td>本身
• 内部<p>高度仅由 撑开，无法匹配<td>跨4行的42px总高度，导致边框未覆盖全表

可行实现方案 #

方案1：修正内联样式位置（无外部/内部CSS代码块） #

HTML原生标签无单侧边框专属属性，仅需将内联样式移至目标<td>即可实现全高边框：

• 移除内部<p>的border-left样式
• 给rowspan="4"的目标<td>添加border-left: 1px solid #000内联样式
• 可简化内部内容（移除冗余<p>，直接放置 ）

修正后的核心代码片段：

<td style="width: 19px; height: 42px; border-left: 1px solid #000;" rowspan="4">
  &nbsp;
</td>

方案2：无CSS纯原生模拟 #

若必须完全不使用CSS，可通过原生HTML属性实现：

• 给rowspan="4"的目标<td>设置原生属性bgcolor="#000"
• 在该<td>内部嵌套一个原生属性bgcolor="#fff"的元素（如<div>），仅预留1px宽度的黑色背景露出，模拟左侧边框

内容的提问来源于stack exchange，提问作者Damian Dąbrowski