我的简单导航栏的导航栏代码似乎不起作用



我的HTML代码:

<head>
<link href="<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.1/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-+0n0xVW2eSR5OomGNYDnhzAbDsOXxcvSN1TPprVMTNDbiYZCxYbOOl7+AMvyTG2x" crossorigin="anonymous"">
</head>
<section class="standard-sidebar">
<h1>Food Web</h1>
<nav id="standard" class="single-level nav" role="navigation">
<ul>
<li><a href="#">1</a></li>
<li><a href="#">2</a></li>
<li><a href="#">3</a></li>
<li><a href="#">4</a></li>
<li><a href="#">5</a></li>
</ul>
</nav>
</section>

我的CSS:

.single-level nav{
display: flex;
justify-content: space between;
}

这似乎根本不起作用。

您需要将您的样式应用于ul元素:

.single-level ul{ display: flex; justify-content: space between; }

最新更新