从链接中删除下划线

时间:2015-08-18 06:47:18

标签: html css twitter-bootstrap-3

我有以下代码:

BasicDBObject query = new BasicDBObject();
query.put("gender",new BasicDBObject("$type",2));
query.put("city",new BasicDBObject("$type",2));
query.put("phone",new BasicDBObject("$type",2));
query.put("email",new BasicDBObject("$type",2));
query.put("date",new BasicDBObject("$type",2));
query.put("age", new BasicDBObject("$type",1));

    DBCursor cursorDoc  =  collection.find(query);
    while (cursorDoc.hasNext()) {
        BasicDBObject object = (BasicDBObject) cursorDoc.next();
        System.out.println(object);
    }

执行时,“Watch”在悬停时有一个非常持久的下划线。设置<html> <head> <link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css"> <style> .nodecor { text-decoration: none; } .strowb1 { width: 150px; height: 35px; background-color: #1F375F; text-align: center; color: #999999; font-family: calibri; font-weight: bold; font-size: 110%; display: block; } .fullcell { height: 100%; width: 100%; color: #999999; } </style> </head> <body> <table> <tr> <td class="strowb1"> <a class="nodecor" href="#"> <div class="fullcell">Watch</div> </a> </td> </tr> </table> </body> </html> 似乎无法将其删除。

我已尝试在表格,tr,td和div上将text-decoration设置为none。

pwatch

请提出建议。

注意:删除引导程序css的链接会删除下划线,但我需要在代码的其他区域中使用它。

7 个答案:

答案 0 :(得分:5)

您应该提高规则的特异性,因为引导目标是a:hover并且优先。另一个选择是在引导程序之后放置相同的特定规则。 如果两个声明具有相同的权重,来源和特异性,则后者指定胜出

&#13;
&#13;
.nodecor:hover {
  text-decoration: none;
}
.strowb1 {
  width: 150px;
  height: 35px;
  background-color: #1F375F;
  text-align: center;
  color: #999999;
  font-family: calibri;
  font-weight: bold;
  font-size: 110%;
  display: block;
}
.fullcell {
  height: 100%;
  width: 100%;
  color: #999999;
}
&#13;
<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
<table>
  <tr>
    <td class="strowb1">
      <a class="nodecor" href="#">
        <div class="fullcell">Watch</div>
      </a>
    </td>
  </tr>
</table>
&#13;
&#13;
&#13;

参考:MDN - Specificity - w3.org - Cascading order

答案 1 :(得分:3)

试试这个:

<style>
a{
text-decoration:none;
}
a:hover 
{
   text-decoration: none;
}
<style>

将text-decoration设置为div,其他表特定标记无用。此属性专门为锚<a>标记定义。

看,如果有帮助。

答案 2 :(得分:1)

也添加

.nodecor:hover 
{
    text-decoration: none;
}

答案 3 :(得分:0)

可能没有删除它,因为它在fullcell下。尝试

.nodecor .fullcell {
    text-dcoration:none;
}

答案 4 :(得分:0)

它将在悬停时删除行:

a:hover
{
    text-decoration: none;
}

答案 5 :(得分:0)

使用此css

value

答案 6 :(得分:-1)

a:悬停,a:主动,a:焦点也使用那些,因为如果你查看开发者工具(谷歌浏览器),你会看到。 <{1}}还不够

a:hover