一天前我开始学习 CSS、HTML 和其他很酷的东西。我真的不明白为什么我的页脚不起作用。
你能帮我解决我的问题,告诉我我做错了什么,或者只是告诉我,我应该去玩俄罗斯方块吗?
HTML 代码:
<title>MyDotCom</title>
<body>
<div id="header">My awesome page title, logo, etc.</div>
<div id="left">Navigation menu</div>
<div id="bar">Random bar, lol.</div>
<div id="footer">Coded by: me</div>
<div id="content">
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Proin nibh augue, suscipit a, scelerisque sed, lacinia in, mi. Cras vel lorem. Etiam pellentesque aliquet tellus. Phasellus pharetra nulla ac diam.
</div>
</body>
CSS 代码:
#header {
border-radius: 5px;
background-color: #C6E2FF;
width: 100%;
height: 100px;
position: relative;
margin-top: -10px;
margin-bottom: 10px;
}
#bar {
border-radius: 8px;
background-color: #6E4005;
width: 90%;
height: 40px;
float: both;
margin-left: 10%;
position: relative;
z-index:1;
}
#left {
float:left;
background-color: #F6C483;
margin-bottom: 10px;
width: 20%;
height:400px;
position: relative;
z-index: 2;
}
#content {
position: relative;
float: right;
width: 80%;
height: 360px;
background-color: #F4EBC3;
margin-bottom: 10px;
}
#footer {
background-color: #B0B0B0;
position:absolute;
clear:both;
height: 30px;
}
我尝试更改position:absolute;
为position:relative;
,但没有成功。
很难向你寻求帮助,因为可能真的很简单,但我试过了,试过了,不知道该怎么做。