删除红色下划线

Question

我正在尝试仅使用文本的href来创建指向我网站其他页面的链接，使文本具有背景颜色并定义悬停效果。一切都很完美，除非我鼠标悬停在红线上，出现在我所有单词链接的底部。即使我对不同的单词有不同的链接，我也总是把红色用下划线表示我的所有单词。我已经尝试过text-decoration：none和！important标签，但都没有。这似乎是你在工作中拼写错误的结果。

这是我的代码：

.text-link-style {
background-color: #40bdb3;
color: white;
font-size: 14px;
font-family: "Lato", sans-serif;
font-weight: 700;
padding: 10px;
line-height: 42px;}

.text-link-style:hover {
color: white;
background: rgba(64, 189, 179, 0.8);
text-decoration: none; !important;}

如何删除它？ 谢谢！