麻烦老师批改一下作业,谢谢!
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style type="text/css">
* {
margin: 0;
padding: 0;
}
.clearfix:after,
.clearfix:before {
content: " ";
display: block;
clear: both;
}
.top,
.bottom {
width: 80%;
margin: 0 auto;
}
.top {
background-color: rgba(173, 216, 230, 1.00);
margin-top: 40px;
}
.bottom {
background-color: rgba(255, 182, 193, 1.00);
}
.t-left {
float: left;
width: calc(50% - 20px);
text-align: center;
margin: 10px;
}
.t-right {
float: right;
width: calc(50% - 20px);
text-align: center;
margin: 10px;
}
.b-left,
.b-middle {
float: left;
width: calc(33.33333% - 20px);
text-align: center;
margin: 30px 10px;
}
.b-left {
text-align: right;
}
.b-right {
float: right;
width: calc(33.33333% - 20px);
text-align: left;
margin: 30px 10px;
}
</style>
</head>
<body>
<div class="top clearfix">
<div class="t-left"><img src="http://img1.sycdn.imooc.com/climg//58c0f808000129a303600215.jpg" alt="1"></div>
<div class="t-right"><img src="http://img1.sycdn.imooc.com/climg//58c0f819000198a703600214.jpg" alt="2"></div>
</div>
<div class="bottom clearfix">
<div class="b-left"><img src="http://img1.sycdn.imooc.com/climg//58c0f81d0001fe4402000060.jpg" alt="3"></div>
<div class="b-middle"><img src="http://img1.sycdn.imooc.com/climg//58c0f8220001dfce02000060.jpg" alt="4"></div>
<div class="b-right"><img src="http://img1.sycdn.imooc.com/climg//58c0f8780001c74602000060.jpg" alt="5"></div>
</div>
</body>
</html>16
收起
正在回答 回答被采纳积分+1
前端小白入门系列课程
- 参与学习 人
- 提交作业 11218 份
- 解答问题 36712 个
从一个不会编程的小白到一个老司机是需要过程的,首先得入门,学习基础知识,然后才能进阶,最后再到精通,本专题是你走进前端世界的不二选择!
了解课程
恭喜解决一个难题,获得1积分~
来为老师/同学的回答评分吧
0 星