使用css部分删除超链接

时间:2014-04-08 13:20:16

标签: javascript css html

我有两个div我想从第一个div中删除超链接下划线,第二个用超链接显示它。我使用css文件做了那些chages,代码在

下面
a:hover, a:visited, a:link, a:active{
   text-decoration: none;
   color:#000000;
}

当我使用上面的代码时,它会对所有超链接产生影响,但我只想从类home和class中删除超链接。你能帮我解决一下吗? div标签是

<div>
<ul>
<li class="home"><a href="#">Home</a></li>
<li class="about"><a href="#">About</a></li>
</ul>
</div>
<div>
<ul>
<li class="clients"><a href="#">Clients</a></li>
<li class="contact"><a href="#">Contact Us</a></li>
</ul>
</div>`

3 个答案:

答案 0 :(得分:1)

您应该在链接声明之前使用类,如下所示:

.home a:hover, 
.home a:visited, 
.home a:link, 
.home a:active,
.about a:hover, 
.about a:visited, 
.about a:link, 
.about a:active{
  text-decoration: none;
  color:#000000;
  cursor: pointer;
}

cursor:pointer更改标准箭头的hiperlink'hand'光标。

答案 1 :(得分:0)

您应该仅通过指定类选择器为“home”和“about”链接添加类选择器:

.home a,
.about a {
   text-decoration: none;
   color:#000000;
}

因为你的规则

a:hover, a:visited, a:link, a:active{
    text-decoration: none;
    color:#000000;
}

text-decoration: none应用于页面上的所有 <a>元素。

答案 2 :(得分:0)

您可以通过以下几种方式实现:

.home a, .about a{
  text-decoration:none;
}

ul:first-of-type li a{
  text-decoration:none;
}

您不需要添加任何:link:active :visited,因为普通a会抓住所有内容。

你可以更进一步,添加一些其他风格,使它看起来像正常&#39;文本。

color:#000000 /*black text*/
cursor:pointer; /*normal arrow cursor*/