Rails 7移除link_to下划线，实现表头统一样式

针对你在Rails 7 + Turbo + Bootstrap项目里遇到的可排序列表头链接下划线问题，有几种直接的解决方式：

方法1：使用Bootstrap内置类 #

Bootstrap提供了现成的类可移除链接下划线，直接给link_to添加text-decoration-none类即可，还可按需保留hover状态的下划线：

<%= link_to "Status", your_path(sort: "status", direction: next_direction), class: "text-decoration-none" %>

如果需要hover时显示下划线增强交互提示，再加text-decoration-underline-hover类：

<%= link_to "Status", your_path(sort: "status", direction: next_direction), class: "text-decoration-none text-decoration-underline-hover" %>

方法2：自定义CSS类 #

若要统一管理所有可排序列表头样式，可在项目CSS文件（如app/assets/stylesheets/application.bootstrap.scss）中添加自定义类：

.sortable-header-link {
  text-decoration: none !important;
  color: inherit; /* 继承表头文字颜色，和普通表头保持一致 */
}

.sortable-header-link:hover {
  text-decoration: underline; /* 可选：hover时显示下划线提示可点击 */
}

之后在视图里给link_to应用该类：

<%= link_to "Status", your_path(sort: "status", direction: next_direction), class: "sortable-header-link" %>

方法3：修改表格内链接全局样式（谨慎使用） #

如果希望表格内所有表头链接都去掉下划线，可编写全局样式：

table th a {
  text-decoration: none;
  color: inherit;
}

table th a:hover {
  text-decoration: underline;
}

这种方式会影响所有表头链接，适合所有可排序表头需要统一样式的场景。

以上方法均可让可排序列表头样式与普通表头保持一致，且不影响排序功能正常运行。

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