我的a：悬停由于某种原因不起作用

Question

不确定为什么它不起作用，但这是我的代码。

 .tm-nav ul li{
 display: inline-block;
 margin-top: 20px;}

 .tm-nav ul li a {
 padding: 10px 20px;
 text-decoration: none; 
 font-family: Trebuchet MS;
 font-size: 22px;
 margin-left: 50px;
 color: #8e7e6b;
 }

 .tm-nav a:hover: {
  color: black;}

这是我的HTML：

     <nav class="tm-nav">
                 <ul>
                   <li><a href="#">Home</a></li>
                   <li><a href="#">About</a></li>
                   <li><a href="#">Products</a></li>
                   <li><a href="#">Privacy</a></li>
                 </ul>
               </nav>

每当我将鼠标悬停在导航链接上时，他们都不会改变颜色，甚至添加文字装饰：a下划线：悬停不会生效。

Answer 1

.tm-nav a:hover: {
  color: black;}

应该是

.tm-nav a:hover {
  color: black;}

Answer 2

你有一个额外的冒号坐在“.tm-nav a：hover {}”

上

我删除了冒号并在我的计算机上试了一下它就可以了。