2-9作业题
来源:2-10 编程练习
想取的名字都被占了
2017-08-18 15:40:02
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
<style>
*{
margin: 0;
padding: 0;
}
.nav{
width:100%;
height:100px;
background:black;
position: fixed;
}
.text{
float:right;
}
.text li{
display:inline-block;
width:120px;
height: 100px;
text-align: center;
line-height: 100px;
color: #fff;
font-family: "微软雅黑";
font-size: 20px;
}
.logo{
float: left;
}
.body{
padding-top: 100px;
width: 100%;
height: 500px;
background: lightblue;
font-family: "微软雅黑";
}
.body1{
float: left;
width:60%;
line-height: 40px;
padding-top: 80px;
}
.body2{
float: right;
width:40%;
line-height: 40px;
padding-top: 80px;
}
.abc{margin-left:120px; }
span{background:#FFB6C1;}
.foot1{
background: black;
width: 100%;
height: 50px;
text-align: center;
color: white;
line-height:50px;
}
</style>
</head>
<body>
<div class="nav">
<div class="logo">
<img src="http://climg.mukewang.com/58c0d2d900016ce303000100.png" />
</div>
<div class="text">
<ul>
<li>课程</li>
<li>职业路径</li>
<li>实战</li>
<li>提问</li>
<li>手记</li>
</ul>
</div>
</div>
<div class="body">
<div class="body1">
<h1 class="abc">课程推荐</h1>
<p class="abc"><span>职业路径</span> HTML5与CSS3实现动态网页</p>
<p class="abc"><span>职业路径</span> 零基础入门</p>
<p class="abc"><span>职业路径</span> iOS 11入门</p>
<p class="abc"><span>职业路径</span> PHP入门</p>
<p class="abc"><span>职业路径</span> Java开发入门</p>
</div>
<div class="body2">
<h1>相关课程</h1>
<p>HTML CSS JavaScrip</p>
<p>HTML5 CSS3 Jquery</p>
<p>移动端基础 移动端APP开发</p>
</div>
</div>
<div class="foot1">
网站首页 企业合作 人才招聘 联系我们 常见问题 友情链接
</div>
</body>
</html>
1回答
Miss路
2017-08-18
可以的,基本的大块做到了,但是有些小的细节,做的不好,或者说是标签的使用还不是很会用,比如,footer中有好多个导航项,最好不用要每个之间加上空格( ;),可以像头部的导航一样,使用ul和li来实现。继续加油!
相似问题