Question

我头版上的链接（也就是POSTS出现的页面）是红色的，当它们盘旋时会变成白色。但是在我的STATIC页面上，我希望链接在悬停时为白色和红色，我该怎么做？ Tumblr允许将html添加到静态页面。

这是我头版的css标记：

  a{
  text-decoration:none;
   color:red;
   }

 a:hover{
 color:white;
-moz-transition: all .2s;
 -webkit-transition: all .2s;
 -o-transition: all .2s;
   transition: all .2;
  }

现在这是我静态页面上的html

   <ul id="list">
    <li><a href="http://tumblr.com">test </a></li>
      </ul>

静态页面继承了首页的html和css。我试过添加

       <div id="page"> </div>

这样就变成了

<div id="page">
 <ul id="list">
    <li><a href="http://tumblr.com">test </a></li>
      </ul>
  </div>

然后尝试使用css设置样式：

ul.list li {
color: white

}

但这不起作用.. :(有人可以帮助我吗？

Answer 1

它不起作用，因为你实际上没有在第二个样式声明中定位锚标记。尝试：

#page #list a {
    color: #fff; /* white */
}

这不会改变悬停状态，但会改变颜色。要更改悬停状态，您必须专门定位以覆盖您在上面定义的通用a：hover。

您还需要定义'：visited'样式，否则您可能看不到这些更改（因为链接已被访问过）。

#page #list a:visited {
    color: #fff; /* white */
}

或者您可以在一个区块中定义所有状态，假设它们应该具有相同的样式。

#page #list a, #page #list a:visited, #page #link a:hover, #page #list a:active {
    color: #fff; /* white */
}

如果不清楚，第一个选择器就像最初一样定位链接，第二个选择器一旦被访问就定位链接，第三个定位链接的悬停状态（即鼠标悬停在其上的样式）链接），第四个目标是链接的活动状态（即实际点击/点击链接时）。

此外，您没有使用正确的选择器进行ID选择。 ''按类选择，'＃'按ID选择。

如何在我的tumblr静态页面上获得不同的链接颜色然后我的主页（首页？）

1 个答案: