【问题标题】:Color of link doesn't change链接颜色不变
【发布时间】:2014-05-05 18:44:51
【问题描述】:

我在网上和这里搜索并没有找到这种情况。 问题是我无法更改链接的颜色。我有以下结构:

 <ul id="footer_menu">
              <li class="footer_title">Sobre</li>
              <li><a href="#">Sobre nós</a></li>
              <li><a href="#">Entre em contato</a></li>
              <li><a href="#">Contribua</a></li>
 </ul>


a {
    text-decoration: none;
    -webkit-transition: all .2s linear;
    -moz-transition: all .2s linear;
    -ms-transition: all .2s linear;
    -o-transition:  all .2s linear;
    transition: all .2s linear;
}

ul#footer_menu li a{
    color: #848587;
}

ul#footer_menu li a:hover {
    color: #FFFFFF;
}

如您所见,我尝试将链接的最具体路径放在 footer_menu 上,但链接的颜色仍为蓝色,令人惊讶的是悬停工作正常。

如果有人可以帮助我。其实我只是问,因为一切似乎都很好。我不能将颜色放在第一个 a 中,因为我的链接不会有相同的颜色。

谢谢

【问题讨论】:

  • Seems to work。也许其他一些风格会覆盖这个?
  • 可能有另一个具有更高 css 特异性的规则。
  • 它应该适用于上述css规则。如果它不适合您,那么可能是其他一些 css 规则覆盖了您的链接的属性

标签: html css hyperlink


【解决方案1】:

试试这个

<nav id="myslidemenu">
<ul>
<li><a href="what-we-do.html">What we do</a></li>
<li><a  href="our-services.html">Our services</a></li>
<li><a href="who-we-are.html">Who we are</a></li>
<li><a href="case-studies.html">Case studies</a></li>
<li><a href="testimonials.html">Testimonials</a></li>
</ul>
</nav>   

CSS

nav ul li a{ 
    color:#000;
    border-bottom: 1px solid #FFBE08;
   -webkit-transition: border-bottom linear 1s;
   -moz-transition: border-bottom linear 1s;
   -o-transition: border-bottom linear 1s;
    transition: border-bottom linear 1s;
    text-decoration:none;
}

nav ul li a:hover{ color:#000; border-bottom:1px solid #000; }

【讨论】:

  • 恐怕这也不能回答问题。问题中的 CSS 应该按原样工作。不需要新的方法来达到相同的结果。
【解决方案2】:

试试这个:

ul#footer_menu li a{
    color: #848587 !important;
}

【讨论】:

    【解决方案3】:

    看看Fiddle它工作得很好

    ul#footer_menu li a{
        color: red;
    }
    
    ul#footer_menu li a:hover {
        color: #FFFFFF;
    }
    

    【讨论】:

    • 不回答问题。
    • @Vucko 谁写了 ul #footer_menu li a??
    • 你们可以解释一下来投反对票的原因:(我们正在努力提供帮助,但有时可能是错误的,所以你们可以帮助我们改进而不是投反对票
    • 你所做的只是删除ul;这没有回答问题。
    • 当然可以了 :) 如果你把 ul 加回来,它也可以工作。
    猜你喜欢
    • 2015-02-28
    • 2015-05-08
    • 1970-01-01
    • 2020-06-28
    • 2018-12-20
    • 1970-01-01
    • 2018-07-21
    • 2014-03-09
    • 1970-01-01
    相关资源
    最近更新 更多