请老师检查作业
来源：2-12 编程练习
Dantong
2020-07-06 14:07:20
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style type="text/css">
/*此处写代码*/
.header{width: 100%;height: 100px;background: black;float: top;}
.banner{position: absolute;top: 50px;left: 60%;}
a{color: white;text-decoration: none;padding: 20px;margin:0 auto;}
.main{width:100%;height:400px;background-color: #87CEFA;float: top;}
li{list-style-type: none;line-height: 50px;line-height: 50px;}
span{background-color: pink;width: 100%;}
.left{width: 30%;float: left;}
.middle{width: 20%;float: left;}
.right{width: 30%;float:right;}
.footer{width: 100%;height: 100px;background: black;float: bottom;margin: 0 auto;line-height: 100px;text-align: center;}
</style>
</head>
<body>
<!-- 此处写代码 -->
<div class="container">
<div class="header">
<img src="http://climg.mukewang.com/58c0d2d900016ce303000100.png"/>
<div class="banner">
<a href="#">课程</a>
<a href="#">职业路径</a>
<a href="#">实况</a>
<a href="#">猿问</a>
<a href="#">手记</a>
</div>
</div>
<div class="main">
<div class="left">
<ul>
<b>课程推荐</b>
<li><span>职业路径</span> HTML5与CSS3实现动态网页</li>
<li><span>职业路径</span> 零基础入门Android语法与界面</li>
<li><span>职业路径</span> iOS基础语法与常用控件</li>
<li><span>职业路径</span> PHP入门开发</li>
<li><span>职业路径</span> JAVA入门开发</li>
</ul>
</div>
<div class="middle">
<ul>
<b>相关课程</b>
<li>HTML CSS Javascript</li>
<li>HTML CSS Jquery</li>
<li>移动端基础 移动端APP开发</li>
</ul>
</div>
<div class="right">
<ul>
<b>登录</b>
<li><input type="text" name="text" placeholder="请输入登录邮箱/手机号"></li>
<li><input type="password" name="password" placeholder="6-16位密码，区分大小写，不能用空格"></li>
<li><input type="submit" name="enter"></li>
</ul>
</div>
</div>
<div class="footer">
<a href="#">网站首页</a>
<a href="#">企业合作</a>
<a href="#">人才招聘</a>
<a href="#">联系我们</a>
<a href="#">常见问题</a>
<a href="#">友情链接</a>
</div>
</div>
</body>
</html>写回答
1回答
-
好帮手慕码
2020-07-06
同学你好，代码中问题如下：
1、顶部导航建议使用li去布局。如下：
2、中部整体的高度可以调大一些，更加美观。
3、中部表单的按钮样式可以优化，例如：
4、底部的导航建议优化：
如果我的回答帮到了你，欢迎采纳，祝学习愉快~
0
