请老师检查，有什么需要改进的？

来源：2-10 编程练习

SpecialMe

2020-09-01 22:08:24

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>两列布局</title>
<style type="text/css">
*{padding:0;margin:0;}
.header,.footer{
width:100%;
height:100px;
background:black;
overflow:hidden;
position:fixed;
font-size:18px;
color:white;
}
.header{top:0;}
.logo{
width:60%;
height:100px;
float:left;
}
.nav{
width:40%;
height:100px;
line-height:100px;

float:right;
}
.nav li,.footer-list li{
list-style:none;
display:inline-block;
padding:0 30px;
}
.logo img,li{cursor:pointer;}
.main{
padding:200px 0 100px 200px;
background:#ccffff;
width:100%;
height:600px;
}
.left{
width:40%;
float:left;
}
.right{
width:60%;
float:right;
}
h2,p{

margin-bottom:25px;
}
.left p span{
display:inline-block;
background: #ff9966;
margin-right:10px;
}
.footer{
bottom:0;
text-align:center;
}
.footer-list{
width:100%;
height:100px;
line-height: 100px;
}
</style>
</head>
<body>
<div class="header">
<div class="logo"><img src="http://climg.mukewang.com/58c0d2d900016ce303000100.png"/></div>
<ul class="nav">
<li>课程</li>
<li>职业路径</li>
<li>实战</li>
<li>猿问</li>
<li>手记</li>
</ul>
</div>
<div class="main">
<div class="left">
<h2>课程推荐</h2>
<p><span>职业路径</span>html5和css3实现动态</p>
<p><span>职业路径</span>html5和css3实现动态</p>
<p><span>职业路径</span>html5和css3实现动态</p>
<p><span>职业路径</span>html5和css</p>
<p><span>职业路径</span>html5和css3</p>
</div>
<div class="right">
<h2>相关教程</h2>
<p>css  html  javascript</p>
<p>css3  html5</p>
<p>移动端基础  移动端app开发</p>
</div>
</div>
<div class="footer">
<ul class="footer-list">
<li>网站首页</li>
<li>企业合作</li>
<li>人才招聘</li>
<li>联系我们</li>
<li>常见问题</li>
<li>友情链接</li>
</ul>
</div>
</body>
</html