代码之家  ›  专栏  ›  技术社区  ›  Kiada

如何解决这个css链接继承问题?

  •  0
  • Kiada  · 技术社区  · 15 年前

    这让我很难受,我试过几件事,但我又不是很有经验,所以我可能只是走错了路。基本上,我想有不同的链接样式,导航和分页。导航样式正在覆盖我的.分页样式,而且分页是一个类还是一个id似乎无关紧要。我也试过放置!在分页样式中很重要,但这会使导航继承分页(一直使用firebug检查继承)。

    #navigation a:active, a:link, a:visited, a, a:focus {
    color: #ffde2f;
    font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
    font-size: 24px;
    text-decoration: none;
    }
    
    #navigation a:hover {
    color: #ffffff;
    font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
    font-size: 24px;
    text-decoration: none;
    } 
    
    .pagination a:active, a:link, a:visited, a, a:focus {
    color: #fff;
    font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
    font-size: 14px;
    text-decoration: none;
    }
    
    .pagination {
    color: #fff;
    font-size: 14px;
    font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
    
    }
    
    3 回复  |  直到 15 年前
        1
  •  3
  •   Puaka    15 年前

    试试这个变化

    .pagination a:active, a:link, a:visited, a, a:focus {
    

    .pagination a:active, 
    .pagination a:link, 
    .pagination a:visited, 
    .pagination a, 
    .pagination a:focus {
    
        2
  •  0
  •   LaustN    15 年前

    改变导航,在标签上使用一个类,而不是在id上使用样式。根据id进行样式设置更为具体,因此在样式设置中获得更高的优先级。

        3
  •  0
  •   knut    15 年前

    使用 child selector :

    #navigation > a
    {
      ...
    }
    
    .pagination > a
    {
      ...
    }
    

    IE6不支持它,但它正在消亡。