我将导航设置为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;
}
如果我添加边距或填充,它仍会停留在页面顶部,只是将文本内部进一步往下推。使元素更大,但不能更远。任何答案都非常感谢:)
position: fixed;
固定元素将忽略导航,使导航高度自动为0。您需要将导航高度设置为nav或更改导航ul的位置
本文收集自互联网,转载请注明来源。
如有侵权,请联系[email protected] 删除。
我来说两句