版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/qq_37049781/article/details/84993106
简单写一个导航栏
<style type="text/css">
* {
margin: 0px;
padding: 0px;
}
#daohang {
height: 40px;
width: 100%;
padding-left: 32px;
background-color: #00a2d4;
/*text-align: center;*/
line-height: 40px;
}
#daohang span {
padding: 0px 20px;
border: 0px;
}
</style>
<div id="daohang">
<span>首页</span>
<span>网站建设</span>
<span>程序开发</span>
<span>网络营销</span>
<span>企业vi</span>
<span>案例展示</span>
<span>联系我们</span>
</div>
效果
可以看到,每两个span之间莫名的多了意料之外的边距,这些边距是在coding中编写span时换行所导致,修改代码:
<span>首页</span><span>网站建设</span><span>程序开发</span><span>网络营销</span><span>企业vi</span><span>案例展示</span><span>联系我们</span>
或类似于下面这种让一个完整的span标签跨行的写法
<span>首页</span
><span>网站建设</span
><span>程序开发</span
><span>网络营销</span
><span>企业vi</span
><span>案例展示</span
><span>联系我们</span>
或者是修改以下属性:
#daohang {
font-size:0px
}
#daohang span {
font-size:15px
}