css - 在 :hover 上覆盖样式

Question

我正在创建一个收件箱，其中侧面有一个 asp 菜单，中间有一个收件箱。当我从数据库中看到新行时，我需要将字体颜色更改为红色并使其变为粗体。我用过adding在菜单项上。

如果没有悬停，它看起来像这样。

如果悬停它必须看起来像这样。

但问题是，当我将鼠标悬停在文本上时，它看起来像上面显示的图像，但如果我稍微悬停在 menuItenm 的顶部或底部(在菜单项内但不在文本上)，那么这看起来像这个。

CSS 用于菜单项。

.Menu ul li a {
color: black;
background: #E9E9E9;
display: block;
padding: 5px 0;
line-height: 17px;
padding-left: 8px; /*link text is indented 8px*/
text-decoration: none;}

.Menu ul li a:hover{
background-image: none;
color: white;
background: #424242;}

这是我用来从服务器端更改颜色并将字体设置为粗体的代码。

Menu1.Items[0].Text = "<div class='inboxno' >" + "Inbox (" + (i + 1) + ")" + "</div>";

这是收件箱的 CSS 类。

.inboxno{
background-image: none;
color: Red;
font-weight:bold;}

.inboxno:hover{
background-image: none;
color: white;
background: #424242;
font-weight:bold;}

我想我理解了这个问题。这是一个 <DIV>围绕菜单项内的收件箱文本创建，它具有 Css inboxno。但是菜单项有填充，当我将鼠标放在填充区域上时，inboxno:hover 类未应用于 Div。

我认为解决这个问题的方法之一是，如果我可以访问 .Menu ul li a来自 .inboxno:hover 的类(class)我将删除填充属性并在 .inboxno:hover 中设置相同的填充属性。类。

但我不知道如何访问 .Menu ul li a来自 .inboxno:hover 的类(class)类。

你能帮帮我吗？？

Answer 1

不确定您是否只是在询问悬停，但请尝试这样做

.Menu ul li:hover a {
    background-image: none;
    color: white;
    background: #424242;
}