我有一個帶有漢堡選單圖示 (svg) 的基本導航欄。不知道我做了什么,但圖示已經重復了,我不知道問題出在哪里。
導航欄 html:
<div class="navbar">
<a href="#home" class="nav-logo">bunk</a>
<ul id="nav-menu">
<li class="nav-item"><a href=# class="nav-link">coading :</a></li>
<li class="nav-item"><a href=# class="nav-link">mi goreng :</a></li>
<li class="nav-item"><a href=# class="nav-link">biscuits :</a></li>
<li class="nav-item"><a href=# class="nav-link">sign my guestbook</li>
</ul>
<!-- Hamburger menu icon to toggle the nav links -->
<div id="ham"><a href="#"></a></div>
</div>
導航欄 CSS:
.navbar {
display: flex;
justify-content: space-between;
align-items: center;
padding: 1rem 1.5rem;
position: fixed;
top: 0;
left: 0;
right: 0;
transition: top 0.6s;
background-color: black;
}
導航選單CSS:
#nav-menu {
display: flex;
flex-direction: row;
justify-content: space-between;
}
我嘗試將 div id 更改為 class,為圖示嘗試不同的影像 - 沒有雪茄。
https://imgur.com/dxTIw4T
uj5u.com熱心網友回復:
也許你列印了兩次“div”命令,你注意到了嗎?
uj5u.com熱心網友回復:
您的代碼不完整或您尚未共享所有代碼。
如果你想使用純 CSS3,我建議你遵循這個簡單的教程:教程鏈接
轉載請註明出處,本文鏈接:https://www.uj5u.com/net/354665.html
標籤:javascript html css svg 导航栏
上一篇:在React.js中實作JS庫
