3-1案例中怎么让中间是导航栏居中显示,
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>案例</title>
<style>
*{
padding:0;
margin:0;
/*border:1px red solid;
*/
}
.head{
width:100%;
height:64px;
}
.logo{
width:160px;
height:44px;
float:left;
padding-top:10px;
}
.nav{
width:410px;
height:64px;
float:left;
}
.nav-li{
width:80px;
height:64px;
text-align: center;
line-height:64px;
float:left;
}
.icons{
width:330px;
height:64px;
float:right;
}
.i01{
width:64px;
height:64px;
background: url(导航案例/导航案例/001.png) no-repeat center center;
float:left;
}
.i02{
width:64px;
height:64px;
background: url(导航案例/导航案例/002.png) no-repeat center center;
float:left;
}
.i03{
width:64px;
height:64px;
background: url(导航案例/导航案例/003.png) no-repeat center center;
float:left;
}
.i04{
width:64px;
height:64px;
background: url(导航案例/导航案例/004.png) no-repeat center center;
float:left;
}
.i05{
width:64px;
height:64px;
background: url(导航案例/导航案例/005.png) no-repeat center center;
float:left;
}
</style>
</head>
<body>
<!-- 左边 -->
<div class="head">
<!-- logo -->
<div class="logo">
<img src="导航案例/导航案例/logo.png" width="160px" height="40px" alt="">
</div>
<!-- 导航 -->
<div class="nav">
<div class="nav-li">课程</div>
<div class="nav-li">职业路径</div>
<div class="nav-li">实战</div>
<div class="nav-li">猿问</div>
<div class="nav-li">手记</div>
</div>
<!-- 顶部右侧 -->
<div class="icons">
<div class="i01"></div>
<div class="i02"></div>
<div class="i03"></div>
<div class="i04"></div>
<div class="i05"></div>
</div>
</div>
</body>
</html>我试了各种方法都不行,设置margin:0 auto;也是不能导航栏文字居中
25
收起
正在回答 回答被采纳积分+1
2回答
前端小白入门系列课程
- 参与学习 人
- 提交作业 11218 份
- 解答问题 36712 个
从一个不会编程的小白到一个老司机是需要过程的,首先得入门,学习基础知识,然后才能进阶,最后再到精通,本专题是你走进前端世界的不二选择!
了解课程


恭喜解决一个难题,获得1积分~
来为老师/同学的回答评分吧
0 星