gpt4 book ai didi

javascript - 粘性导航不会对齐中心

转载 作者:行者123 更新时间:2023-11-30 16:33:55 26 4
gpt4 key购买 nike

导航栏似乎以我的 15 英寸笔记本电脑为中心。但是当我在 27 英寸的 Mac 上查看它时,它会向左浮动并且偏离中心。我不太确定如何将其居中,因此它似乎在所有显示器上都居中。

SITE ON SERVER

.navContainter{
width: 960px;
}
.nav {
height:60px;
background-color: rgba(0, 0, 0, 0.7);
position: -webkit-sticky;
list-style-type: none;


}


.nav ul {
float: left;
margin: 0 auto;
padding-left: 0px;
padding-top: 10px;

}


ul{
display: inline;
padding: 0;





}

li{
display:inline;
padding:5px;
font-size: 1.5em;
float: left;
margin-right: 50px;
margin-left: 100px;
position: relative;
font-family: "Josefin Slab",serif;

}



a{
width:60px;
color: #fff;

}



.sticky {
position: fixed;
width: 100%;
left: 0;
top: 0;
z-index: 100;
border-top: 0;
}
<head class="navContainer">
<nav class="nav">


<ul>
<li><a href="web.html">WEB</a></li>
<li><a href="photo.html">PHOTOGRAPHY</a></li>
<li><img src="img/demo/_small/logo.png"></li>
<li><a href="design.html">DESIGN</a></li>
<li><a href="video.html">VIDEO</a></li>

</ul>
</nav>

最佳答案

对于 .nav 添加 text-align: center;

对于 .nav ul 删除 float: left; 并添加 display: inline-block;;

关于javascript - 粘性导航不会对齐中心,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/32953398/

26 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com