html - 悬停时更改单个 li 的颜色

Question

悬停时，我正在努力更改该特定 li 的字体颜色。当鼠标指向 li 从白色到黑色时，我的代码无法正常工作。

.tags-list li{display:inline-block;background-color:#253b5d;    padding: 1px 10px !important;
    text-transform: lowercase;
    font-weight: normal;
    font-size: 14px;   
    transition: all 1s linear;
    }
.tags-list li:hover{background-color: #aebdd5;}
.tags-list li a{transition: all 1s linear;color:white;}
.tags-list ul li a:hover{color:black;}

<ul class="tags-list">
<li><a href="#">Testing</a></li>
<li><a href="#">Testing</a></li>
<li><a href="#">Testing</a></li>
<li><a href="#">Testing</a></li>
<li><a href="#">Testing</a></li>
<li><a href="#">Testing</a></li>
</ul>

Answer 1

删除ul.，.tags-list已经引用了ul。它不包含另一个 ul。

.tags-list li{display:inline-block;background-color:#253b5d;    padding: 1px 10px !important;
    text-transform: lowercase;
    font-weight: normal;
    font-size: 14px;   
    transition: all 1s linear;
    }
.tags-list li:hover{background-color: #aebdd5;}
.tags-list li a{transition: all 1s linear;color:white;}
.tags-list li a:hover{color:black;}

<ul class="tags-list">
<li><a href="#">Testing</a></li>
<li><a href="#">Testing</a></li>
<li><a href="#">Testing</a></li>
<li><a href="#">Testing</a></li>
<li><a href="#">Testing</a></li>
<li><a href="#">Testing</a></li>
</ul>