1.正常显示下
2.当我点击区域按钮的时候,出现了一个问题。效果实现了,但是最上面出现一个白色的东西
3.如果我修改nav1的padding的值改成0时,则正常显示
4.但是nav1出现的时候就不正常了
如何解决这个问题
首先:screen包着nav1的,screen只包含了nav1
代码:
.screen{
background-color: white;
position:fixed;
top: 0px;
width: 100%;
z-index: 500;
.nav1{
display: flex;
font-size: 14px;
padding: 10px;
border-bottom:1px solid #ccc;
:last-child{
border-right:none;
}
由于那个nav1
的父盒子是固定定位了的,没有设定高度,高度默认就和内容高度相同了,而使用padding
之后,拖没内容,它也是有高的,高度的计算你应该知道是怎么一回事。
这种情况就不要使用padding了,用定位来解决。或者使用事件来动态更改
padding
的值。
正文完