如何阻止链接点击后文本保持紫色下划线状态？

浏览器会默认对已访问过的链接应用紫色带下划线的样式，并且会在本地记录链接的访问状态，所以即使刷新页面，已访问链接的样式也会保留。你可以通过CSS覆盖这些默认样式来解决这个问题，以下是几种方案：

方案一：全局重置所有链接的状态样式 #

直接覆盖<a>标签所有状态（未访问、已访问、悬停、激活）的样式，统一去掉下划线并设置自定义颜色：

a:link,
a:visited,
a:hover,
a:active {
  text-decoration: none; /* 移除下划线 */
  color: #000; /* 设置为你需要的颜色，比如黑色，也可以用inherit继承父元素颜色 */
}

方案二：仅针对目标链接精准设置 #

如果只想修改包含.video-title的链接样式，避免影响其他链接，可以使用更具体的选择器：

a .video-title {
  text-decoration: none;
  color: #000;
}
/* 单独确保已访问状态的样式一致 */
a:visited .video-title {
  color: #000;
  text-decoration: none;
}

方案三：仅移除已访问状态的特殊样式 #

如果你想保留链接其他状态的默认样式（比如悬停时显示下划线），只需要单独重置已访问状态的样式：

a:visited {
  text-decoration: none;
  color: #1a0dab; /* 设置为和未访问状态相同的颜色，比如Chrome默认未访问链接蓝色 */
}

将上述CSS代码添加到你的样式表中，就能阻止链接点击后出现紫色带下划线的持久状态了。

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