由于某种原因，我的a:hover不起作用

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：hover 下的下划线不会生效。

Answer 1

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

应该是

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

Answer 2

你在".tm-nav a：hover {}"上有一个额外的冒号

我删除了冒号并在我的计算机上尝试了它，它起作用了。