我的导航设置为display: block;
,我的段落设置为display: block;
但是我的段落部分位于页面顶部,涵盖导航。我有导航的CSS,我会认为它应该推开其他物体?
nav {
display: block;
}
nav ul {
display: block;
position: fixed;
-webkit-box-sizing: border-box; width: 100%;
-moz-box-sizing: border-box; width: 100%;
box-sizing: border-box; width: 100%;
text-align: center;
list-style-type: none;
text-decoration: none;
background: rgba(255,255,255,0.2);
}
nav li {
display: inline-block;
margin-left: 5px;
margin-right: 5px;
padding-top: 10px;
padding-bot: 10px;
font-family: "Changa One",Cursive;
font-size: 1.225em;
border-bottom: 2px solid transparent;
transition: border-color 300ms;
-webkit-transition: border-color 300ms;
-moz-transition: border-color 300ms;
}
这是我的段落代码:
p {
background-color: #fff;
display: block;
color: orangered;
}
如果我添加边距或填充,它仍然会粘在页面顶部,只需将文本向下推进。使元素更大但不会进一步下降。任何答案都非常感谢:)
答案 0 :(得分:1)
position: fixed;
固定元素将忽略您的导航,使导航的高度自动为0.您需要设置导航高度或更改导航ul的位置