时间戳

首页 > 解决方案 > 当我将导航栏背景设置为透明时，为什么会有一条细黑线？

html - 当我将导航栏背景设置为透明时，为什么会有一条细黑线？

问题描述

我正在尝试使我的导航栏透明，但是没有明显原因出现一条细黑线。这是它的样子： https ://teampolair.com 菜单选项下方的细黑线

我的 CSS 在这里：

.topnav {
        background-color: transparent;
        overflow: hidden;
        margin-bottom: 0;
        position: fixed;
        top: 0;
        width: 100%;
        z-index: 100;
        font-size: 18px;
    }
    .topnav b {
        float: right;
        padding: 0px 1em;
    }
    .topnav b img {
        height: 2.8em;
        width: auto;
        padding-top: .56em;
    }
    .topnav a {
        color: #E0E0E0;
        text-align: center;
        float: left;
        padding: 0.78em 1em;
        text-decoration: none;
        font-size: 1em;
    }
    .topnav a:hover {
        background-color: #E0E0E0;
        color: #302F2F;
    }
    .topnav a.active {
        background-color: #454544;
    }
    .topnav.scrolled {
        background-color: #000000;
        transition: background-color 200ms linear;
    }

我相信，topnav 中唯一应该影响他的部分是与“a”相关的任何内容。有人能帮我解决我的问题吗？

标签： htmlcss

解决方案

“main.css”的第 247 行有一条 CSS 规则，a其中包含border-bottom: dotted 1px rgba(0, 0, 0, 0.25);. 如果你删除它，你的问题就解决了。

推荐阅读