Question

div ul li a.button:hover {
  text-color:#FF0000;
  background: #0040FF;
}

我正试图获得一个蓝色的按钮，白色文字变为浅蓝色，红色文字悬停在上面然而它似乎无法正常工作。这是按钮代码，这里应该应用它：

<div>
  <ul>
    <li><a href= "index.html"><span>Home</span></a></li>
    <li><a href= "about.html"><span>About</span></a></li>
    <li><a href="help.html"><span>Help</span></a></li>
    <li><a href="links.html"><span>Links</span></a></li>
    <li><a href="About Me.html"><span>About Me</span></a></li>
  <ul>
</div>

每个按钮都是相同的，我希望悬停工作相同，但上传到我的网站时不起作用。

Answer 1

将您的CSS更改为：

div ul li a.button:hover {
    color:#FF0000;
    background-color: #0040FF;
}

尝试将文本颜色更改为颜色并添加该类。

<div>
  <ul>
    <li><a class="button" href= "index.html"><span>Home</span></a></li>
    <li><a class="button" href= "about.html"><span>About</span></a></li>
    <li><a class="button" href="help.html"><span>Help</span></a></li>
    <li><a class="button" href="links.html"><span>Links</span></a></li>
    <li><a class="button" href="About Me.html"><span>About Me</span></a></li>
    <ul>
</div>

Answer 2

尝试background-color: #0040FF;

并将.button课程添加到您的链接中，例如<a class="button"....>....</a>

Answer 3

没有text-color

这样的属性

这应该有效：

div ul li a.button:hover {
  color:#FF0000;
  background: #0040FF;
}

你忘了将课程添加到那些 - 元素

Answer 4

从css中删除按钮

div ul li a:hover {
  color:#FF0000;
  background: #0040FF;
}

CSS按钮悬停更改颜色不起作用

4 个答案: