鼠标移进去文字被隐藏怎么办

HTML代码

    <div class="dropdown">
                 <div class="dt">全部商品分类</div>
                 <div class="dd">
                     <ul class="menu_list">
                        <li><a href="#">家用电器</a> </li>
                        <li><a href="list.html">手机</a>、 <a href="#">数码</a>、<a href="#">通信</a> </li>
                        <li><a href="#">电脑、办公</a> </li>
                        <li><a href="#">家居、家具、家装、厨具</a> </li>
                        <li><a href="#">男装、女装、童装、内衣</a> </li>
                        <li><a href="#">个户化妆、清洁用品、宠物</a> </li>
                        <li><a href="#">鞋靴、箱包、珠宝、奢侈品</a> </li>
                        <li><a href="#">运动户外、钟表</a> </li>
                        <li><a href="#">汽车、汽车用品</a> </li>
                        <li><a href="#">母婴、玩具乐器</a> </li>
                        <li><a href="#">食品、酒类、生鲜、特产</a> </li>
                        <li><a href="#">医药保健</a> </li>
                        <li><a href="#">图书、音像、电子书</a> </li>
                        <li><a href="#">彩票、旅行、充值、票务</a> </li>
                        <li><a href="#">理财、众筹、白条、保险</a> </li>
                     </ul>
                 </div>
             </div>

CSS代码

/* 鼠标滑动时更改a标签的文字的颜色 */
.dropdown .dd ul li:hover a{
  color: #b1191a;
}

#结果

正确写法的结果

.dropdown .dd ul li a:hover{
  color: #b1191a;
}

#鼠标移进去掩盖了文字