如何让导航连接部分不被限制在1200px范围里?
由于设置了1200px的wrap,导致header的logo和nav在1980分辨率显示器全屏打开状态的时候都是处在中间部分的,后面作业也有这个要求,要求在保持1200px的宽度情况下,让logo和nav各顶住屏幕左右,我目前css和效果是这样的
.header{
background-color: #f7f7f7;
}
.header_wrap{
width: 1200px;
height: 80px;
margin: 0 auto;
position: relative;
z-index: 5;
}
.header_logo{
width: 160px;
height: 40px;
line-height: 40px;
font-size: 20px;
color: white;
text-indent: 50px;
background: url('../img/logo.png') left center no-repeat;
background-size: 40px 40px;
position: absolute;
top: 50%;
margin-top: -20px;
left: 20px;
}
.header_nav{
position: absolute;
right: 20px;
height: 40px;
top: 50%;
margin-top: -20px;
}
.header_nav-item{
color: white;
font-size: 16px;
display: block;
height: 40px;
line-height: 40px;
float: left;
margin-left: 40px;
position: relative;
}
正在回答
你好,具体不清你编写的代码,如实现内部内容宽1200px, 里面有logo(居左)和导航(居右)的效果,思路如下:
内部内容宽设置1200px。
logo 设置float:left;
nav 导航设置float:right;
nav 导航里面的每项在设置float:left.
其他样式,根据情况来调整。
希望对你有帮助,祝学习愉快。
- 参与学习 1887 人
- 提交作业 4643 份
- 解答问题 5760 个
有HTML和CSS基础,却不知道如何进阶?本路径带你通过系统学习,完成从“会做网页”到“做出好的动态网页”的蜕变,迈出成为前端工程师的第一步。
了解课程
恭喜解决一个难题,获得1积分~
来为老师/同学的回答评分吧
0 星