从超链接中移除下划线 - Rails

Question

我一直在寻找，但似乎无法改变这个非常烦人的东西！！！所以请好心的人们，帮我去掉链接下划线，但只是特定的一些。非常混乱的那些，谢谢。

一些代码：

    <div id = "cracker-container">

      <div class = "cracker-wrapper">
      <div id = "cracker1-button">
        <%= link_to "cracker", new_crack_path %>
      </div>
      </div>

      <div class = "cracker-wrapper">
    <div id = "cracker2-button">
        Cracker2
    </div>
     </div>

    <div class = "cracker-wrapper">
     <div id = "cracker3-button">
      Cracker3
    </div>
    </div>

    </div>

THE CSS:

#cracker1{
  color: #000;
}

#cracker2{
  color: #000;
}

#cracker3{
  color: #000;
}

#cracker1:active{
  color: #fff;
}

#cracker2:active{
  color: #fff;
}

#cracker3:active{
  color: #fff;
}

- Whenyouforgetapassword

---

欢迎来到Stack Overflow！我们在这里保持礼貌，所以请您以后在问题中避免使用粗言秽语。谢谢！ - Mac

我明白了，我尊重这一点。虽然我没有对任何人不礼貌，只是针对我的代码。骂人让我的代码更有感情。你懂的 ;) - Whenyouforgetapassword

我也有这种感觉，时不时地 :) 只是要小心，不要在你的问题中包含这种内容 - 你可能会被警告、暂停甚至封禁。 - Mac

没问题；）我不会被封禁的:P 顺便说一下，我现在停止。:) - Whenyouforgetapassword

Answer 1

这将从#cracker1-button div下的任何<a>标签中移除文本装饰。

#cracker1-button a:link { 
    text-decoration:none; 
}

然而，这段代码只会去除“新鲜”/未访问链接下划线。一个链接有4个不同的状态：

• 链接：新鲜/未访问过的链接
• 访问过：用户已经访问过的链接
• 悬停：当用户用鼠标悬停在链接上时
• 活动：链接是页面上的活动元素（具有键盘焦点）时

如果您想从所有4种状态的链接中删除下划线，您需要在CSS中指定：

#cracker1-button a:link, #cracker1-button a:visited, #cracker1-button a:hover, #cracker1-button a:active,  { 
    text-decoration:none; 
}

这里提供了一个关于如何使用CSS样式对链接进行美化的参考。

http://www.w3schools.com/css/css_link.asp

- Jeffrey Ray

Answer 2

#cracker1-button a { text-decoration:none; }

不确定这是否是你需要的，但它将从#cracker1中的链接中移除下划线。

- brettkelly

---

我只是想要去掉那个该死的下划线。因为#cracker1正在改变颜色等，虽然这是简化版本，但它看起来像两个饼干按钮并排放置。解决方案真的那么简单吗？：S 要么你是天才，要么我是一个愚蠢的笨蛋。但我没有使用任何“a”标签，那么你怎么能使用#cracker1 a {text-decoration: none}呢？ - Whenyouforgetapassword

我假设<% link_to %>会生成一个锚点元素。这不对吗？ - brettkelly

没错！/m/ /m/ 编辑 这意味着即使我不输入，它也会存在？对吗？我是对的吗？ - Whenyouforgetapassword