Html如何在表格竖线上添加图标

在HTML表格（table）中添加竖线（通常用于创建表头列分隔符或美观效果），你可以使用`<th>`标签，并结合CSS来实现。如果你想插入一个图标作为竖线，可以采用以下步骤：

1. 首先，在`<th>`标签里插入文本，然后在其后放置一个空格，紧跟着使用`<span>`标签来插入图标。例如：

<th>标题</span><span class="icon"></span>

这里假设`.icon`是你的图标类名。

2. 创建一个名为`.icon`的CSS样式，将这个图标设置为垂直居中并定位到单元格的右侧：

.th-icon {
  display: inline-block;
  vertical-align: middle;
  margin-left: 5px; /* 根据需要调整间距 */
}

注意，这里的`display: inline-block`让图标元素成为块级元素，而不是内联元素，以便控制其高度和宽度。

3. 添加你的图标，可以用`<i>`标签从Font Awesome、Materialize等库引入图标，或者使用SVG图标。例如：

<span class="th-icon"><i class="fas fa-chevron-right"></i></span>

如果使用SVG图标，则需要直接嵌入SVG代码：

<span class="th-icon">
  <svg viewBox="0 0 24 24" width="16" height="16">
    <path fill="#000" d="M20 12h-6v-4L12 4l-4 4V12z"/>
  </svg>
</span>