Question

问题1

我想知道当用户将鼠标悬停在导航栏上时是否有人可以帮我改变下拉背景颜色的不透明度？我试过看其他教程。但是，我没有运气。

这是我的代码

    .navbar.navbar-default ul li:after {
      content: '';
      position: absolute;
      right: 50%;
      bottom: 0;
      left: 50%;
      height: 3px;
      background-color: #FFFFFF;
      border-radius: 9px;
      transition: all .2s;
    }

    .navbar.navbar-default ul li a:hover {
      color: white;
    }

Answer 1

使用rgba（）设置背景颜色。

而不是十六进制，rgba采用红色，绿色，蓝色和不透明度值，如下所示：

background-color: rgba(20, 50, 40, 0.5)

rgb值为0到255，不透明度为0到1.

您可以使用以下网站：http://www.colorhexa.com/4f5f4f来帮助您将十六进制值转换为rgb值。

遗憾的是，CSS不支持十六进制颜色的alpha值。

Answer 2

你可以简单地添加下面的css行

.navbar.navbar-default ul li a:hover {
    color: white;
    background: rgba(61, 63, 74, 0.8);
}

如何更改背景颜色的不透明度？

2 个答案: