Question

我已经查看过实施此设计的网站的一些教程，YouTube视频和源代码，但我无法完成它。下面是我想要创建的导航栏类型的图像。 http://imgur.com/BHavGXg

这是我的导航栏html：

<div class="nav">
    <ul>
        <li><a href="#">Notes</a></li>
        <li><a href="#">Classes</a></li>
        <li><a href="#">Works</a></li>
        <li><a href="#">Research</a></li>
        <li><a href="#">About</a></li>
        <li><a href="#">Contact</a></li>
    </ul>

这是我导航栏的CSS：

    .nav {
       width: 100%;
       border: 1px solid #ccc;
       color: #fff;
       border-right: none;
       background-color: rgba(1, 1, 1, 0.6);
       color: rgba(1, 1, 1, 0.8);
}

感谢您的帮助。非常感谢像我这样的初学者。

Answer 1

您必须为导航和文本创建不同的类。要使导航器透明，您可以使用属性

opacity: (Insert value);

希望这有帮助！

部分透明/低不透明度导航栏？

1 个答案: