为什么我的导航栏的样式在页面之间不一致？

Question

所以我一直在 Nekoweb 上摆弄我的网站，试图修复导航栏。我已经用 css 设计了它的样式。样式似乎在index.html（我的主/主页）上工作得很好。但是，当我链接其他页面（例如图库）上的样式表时，样式不会完全应用，因此不会保持一致。我该如何解决这个问题？

这是我迄今为止的造型：

.nav-list {
    margin: 0;
    padding: 1rem 0;
    display: flex;
    justify-content: center;
    align-items: center;
}
.nav-item {
    list-style: none;
    margin-right: 2rem;
}
.nav item a {
    text-decoration: none;
    color: black;
    font-size: 18px;
}

导航栏水平显示，正如我想要的那样。但是，由于某种原因，诸如字体大小之类的内容不会改变。在主页上，它是 18px，但在其他页面上看起来更像是 12px。

这是所述导航栏的 html：

<navbar>
        <ul class="nav-list">
            <li class="nav-item">
                <a href="site.org/index.html">Home</a>
            </li>
            <li class="nav-item">
                <a href="site.org/gallery.html">Gallery</a>
            </li>
            <li class="nav-item">
                <a href="site.org/contact.html">Contact</a>
            </li>
        </ul>
</navbar>

Answer 1

由于代码中的拼写错误，可能会发生字体大小更改。在 CSS 中，你似乎错过了“-”。 (.nav-项目 a)

.nav-item a {
    text-decoration: none;
    color: black;
    font-size: 18px;
}