怎图片变小?recommend course怎么变3行4列?

怎图片变小?recommend course怎么变3行4列?

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Document</title>
<link rel="stylesheet" href="css/startup.css">
</head>
<body>
<header class="header">
<div class="logo"></div>
<div class="nav">
<a href="#" class="nav__item">课程</a>
<a href="#" class="nav__item">职业路径</a>
<a href="#" class="nav__item">实战</a>
<a href="#" class="nav__item">猿问</a>
<a href="#" class="nav__item">手记</a>
</div>
<div class="profile">
<a href="#" class="profile__item profile__shopping"></a>
<a href="#" class="profile__item profile__message"></a
>
<a href="" class="profile__item profile__ava"></a>
</div>
<div class="search">
<input type="text" class="search__input">
<a href="#" class="search__submit"></a>
</div>
</header>
<img class="banner-image" src="img/bg.jpg" alt="">
<div class="recommend">
<div class="recommend-course">
<div class="recomend-course__cover"><img src="img/course1.jpg" alt=""></div>
<div class="recommend-course__plan">
<h2 class="caption">前段小白入门系列</h2>
<div class="recommend-course__times">33课<span class="recommend-course__preson">368人在学</span></div>
<hr>
</div>
<div class="recommend-scourse__price"><i>¥</i>499.00</div>
</div>
<div class="recommend-course">
<div class="recomend-course__cover"><img src="img/course2.jpg" alt=""></div>
<div class="recommend-course__plan">
<h2 class="caption">HTML与CSS3实现动态网页系列课程</h2>
<div class="recommend-course__times">24课<span class="recommend-course__preson">1031人在学</span></div>
<hr>
</div>
<div class="recommend-scourse__price"><i>¥</i>599.00</div>
</div>
<div class="recommend-course">
<div class="recomend-course__cover"><img src="img/course3.jpg" alt=""></div>
<div class="recommend-course__plan">
<h2 class="caption">PHP从零基础到原生项目开发系列课程</h2>
<div class="recommend-course__times">18课<span class="recommend-course__preson">110人在学</span></div>
<hr>
</div>
<div class="recommend-scourse__price"><i>¥</i>498.00</div>
</div>
<div class="recommend-course">
<div class="recomend-course__cover"><img src="img/course4.jpg" alt=""></div>
<div class="recommend-course__plan">
<h2 class="caption">ECShop3从基本使用到二次开发系列课程</h2>
<div class="recommend-course__times">11课<span class="recommend-course__preson">7人在学</span></div>
<hr>
</div>
<div class="recommend-scourse__price"><i>¥</i>298.00</div>
</div>
<div class="recommend-course">
<div class="recomend-course__cover"><img src="img/course5.jpg" alt=""></div>
<div class="recommend-course__plan">
<h2 class="caption">零基础入门Android语法与界面系列课程</h2>
<div class="recommend-course__times">41课<span class="recommend-course__preson">442人在学</span></div>
<hr>
</div>
<div class="recommend-scourse__price"><i>¥</i>399.00</div>
</div>
<div class="recommend-course">
<div class="recomend-course__cover"><img src="img/course6.jpg" alt=""></div>
<div class="recommend-course__plan">
<h2 class="caption">Android网络与数据存储系列课程</h2>
<div class="recommend-course__times">20课<span class="recommend-course__preson">54人在学</span></div>
<hr>
</div>
<div class="recommend-scourse__price"><i>¥</i>599.00</div>
</div>
<div class="recommend-course">
<div class="recomend-course__cover"><img src="img/course7.jpg" alt=""></div>
<div class="recommend-course__plan">
<h2 class="caption">Android从界面到数据存储系列课程</h2>
<div class="recommend-course__times">38课<span class="recommend-course__preson">6人在学</span></div>
<hr>
</div>
<div class="recommend-scourse__price"><i>¥</i>599.00</div>
</div>
<div class="recommend-course">
<div class="recomend-course__cover"><img src="img/course8.jpg" alt=""></div>
<div class="recommend-course__plan">
<h2 class="caption">Java基础语法与常用工具类系列课程</h2>
<div class="recommend-course__times">27课<span class="recommend-course__preson">182人在学</span></div>
<hr>
</div>
<div class="recommend-scourse__price"><i>¥</i>299.00</div>
</div>
<div class="recommend-course">
<div class="recomend-course__cover"><img src="img/course9.jpg" alt=""></div>
<div class="recommend-course__plan">
<h2 class="caption">iOS基础语法(OC&Swift)与常用控件课程</h2>
<div class="recommend-course__times">16课<span class="recommend-course__preson">122人在学</span></div>
<hr>
</div>
<div class="recommend-scourse__price"><i>¥</i>299.00</div>
</div>
</div>
<footer class="footer">
<div class="footer-link">
<a href="#" class="footer-link__item">网站首页</a>
<a href="#" class="footer-link__item">企业合作</a>
<a href="#" class="footer-link__item">人才招聘</a>
<a href="#" class="footer-link__item">联系我们</a>
<a href="#" class="footer-link__item">讲师招聘</a>
<a href="#" class="footer-link__item">常见问题</a>
<a href="#" class="footer-link__item">意见反馈</a>
<a href="#" class="footer-link__item">慕课大学</a>
<a href="#" class="footer-link__item">友情链接</a>
</div>
<div class="footer-copy">Copyright &copy; 2016 imooc.com All Rights Reserved | 京ICP备 13046642号-2</div>
<div class="footer-share">
<a href="" class="footer-share__item footer-share__item_i_1"></a>
<a href="" class="footer-share__item footer-share__item_i_2"></a>
<a href="" class="footer-share__item footer-share__item_i_3"></a>
</div>
</footer>
</body>
</html>


正在回答 回答被采纳积分+1

登陆购买课程后可参与讨论,去登陆

1回答
好帮手慕星星 2018-12-21 18:06:10

同学你好,已经在另一个相同问题中进行了回复,可以查看下:

http://class.imooc.com/course/qadetail/84066

祝学习愉快!

问题已解决,确定采纳
还有疑问,暂不采纳

恭喜解决一个难题,获得1积分~

来为老师/同学的回答评分吧

0 星
响应式开发与常用框架 2018
  • 参与学习           人
  • 提交作业       2198    份
  • 解答问题       5012    个

如果你有web端基础,既想进阶,又想进军移动端开发,那就来吧,我们专题为你带来的课程有HTML5、CSS3、移动基础、响应式、bootstrap、less等,让你在前端道路上畅通无阻!

了解课程
请稍等 ...
微信客服

购课补贴
联系客服咨询优惠详情

帮助反馈 APP下载

慕课网APP
您的移动学习伙伴

公众号

扫描二维码
关注慕课网微信公众号

在线咨询

领取优惠

免费试听

领取大纲

扫描二维码,添加
你的专属老师