CSS边框底部和悬停背景

Question

我需要在鼠标悬停时显示底部边框。

另外我需要同时显示背景颜色。

现在，我几乎拥有它！如果你看到这个例子，你会看到悬停在跨度上会给出下划线。但是我需要在进入超链接区域的时候显示下划线。

a{
text-decoration: none;
padding: 25px;

}

a:hover{
color: white;
background: blue;
}

span:hover{
border-bottom: 2px solid red;
}

<a href="#"><span>Combo</span></a>

Answer 1

试试这个：

a{
text-decoration: none;
padding: 25px;

}

a:hover{
color: white;
background: blue;
}

a:hover{
border-bottom: 2px solid red;
}


<a href="#"><span>Combo</span></a>

Answer 2

这对你有用。

CSS

a {
    text-decoration: none;
    padding: 25px;

}

a:hover {
    color: white;
    background: blue;
    border-bottom: 2px solid red;
}

HTML

<a href="#"><span>Combo</span></a>