我正在尝试为手机制作垂直导航栏,但看起来 CSS 不太好。有人能看出有什么问题吗? 我会尽快发布照片。
HTML代码
#navigation {
width: 100%;
height: auto;
}
ul {
list-style-type: none;
margin: 0;
padding: 0;
width: 100%;
}
li a {
display: block;
width: 100%;
padding: 8px 16px;
margin: 0 auto;
}
.nav-active {
display: block;
width: 100%;
}
li a:hover:not(.active) {
color: #1b9cc6;
}
<div id="navigation">
<ul>
<li><a class="active" href="#about">ABOUT</a></li>
<li><a href="#clients">CLIENTS</a></li>
<li><a href="#services">SERVICES</a></li>
<li><a href="#work">WORK</a></li>
<li><a href="#contact">CONTACT</a></li>
</ul>
</div>
最佳答案
伙计,你的#navigation
占用100%
的宽度
。它占用屏幕宽度的百分之一百。尝试将其更改为更小的值。
关于HTML/CSS 垂直导航栏还是水平的?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/42688747/