header {
display: flex;
justify-content: space-between;
}
nav {
display: none;
}
header svg {
width: 3em;
margin-top: -6em;
cursor: pointer;
}<div>
<header>
<a href="#" class="logo">Shoe<span>Brand</span></a>
<nav>
<ul>
<li><a href="#">Home</a></li>
<li><a href="#">Sneakers</a></li>
<li><a href="#">Players</a></li>
</ul>
</nav>
<svg class="close" viewBox="0 0 48 32" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M24 32H0V26.6667H24V32ZM48 18.6667H0V13.3333H48V18.6667ZM48 5.33333H24V0H48V5.33333Z" fill="white"/>
</svg>
</header>我嘗試專門參考 nav 中的 ul 和 li 標簽，但我仍然看不到 svg。更讓我困惑的是 cursor: pointer 仍然有效，即使那里什么也沒有。
我想隱藏導航而不影響 svg。
uj5u.com熱心網友回復：
給路徑填充顏色并移除負上邊距。
header {
display: flex;
justify-content: space-between;
}
nav {
display: none;
}
header svg {
width: 3em;
cursor: pointer;
}<header>
<a href="#" class="logo">Shoe<span>Brand</span></a>
<nav>
<ul>
<li><a href="#">Home</a></li>
<li><a href="#">Sneakers</a></li>
<li><a href="#">Players</a></li>
</ul>
</nav>
<svg class="close" viewBox="0 0 48 32" xmlns="http://www.w3.org/2000/svg">
<path d="M 24 32 H 0 V 26.6667 H 24 V 32 Z M 48 18.6667 H 0
V 13.3333 H 48 V 18.6667 Z M 48 5.3333 H 24 V 0 H 48 V 5.3333 Z" fill="black" />
</svg>
</header>轉載請註明出處，本文鏈接：https://www.uj5u.com/qukuanlian/536437.html