1. 基本完成轮播图

2.了解了动画

明天计划的事情：

1. 完成第一图

遇到的问题：

1.一开始没有什么思路，不知道怎么做这个轮播图，后来查找了资料，想了个思路就是把需要轮播的图片放在一个盒子里，设置宽度为页面宽度三倍，图片宽度设置为页面宽度，用动画加margin，然后再给这个盒子外面套上一个盒子，给他设置overf：hidden实现轮播功能

2. 弄完上面的事后，卡在了最后一张图与第一张图的衔接上，前面的图都一张一张慢慢移过去，跟任务八的效果一样，而最后一张跟第一张衔接是直接一闪就到第一张了

    查找资料后，解决办法是给最后一张再加上第一张的那个图，让原先的最后一张移到新的最后一张，虽然他也是直接一闪调到第一张，但是因为新的最后一张图跟第一张的图片一样，所以感觉不出他是闪过去的

收获：

动画animation

1.先绑定一个选择器

2.规定名称，时长等等animation：名称  时长；

3.创建动画@keyframes 名称 { from{}  to{} }，可以用%，从0%-100%；

animation 所有动画的简写属性，除了animation-play-state

animation-name： ； 动画名称

animation-duration： ；完成一个周期需要多少秒/毫秒/%

animation-timing-function：；如何完成一个周期，默认ease

animation-fill-mode：；完成动画，或有延迟未开始播放时，要应用到元素的样式

animation-delay： ；何时开始动画秒/毫秒/%

animation-iteration-count：n/infinite (无穷)；重复次数

animation-direction：；下一周是否逆放,默认normal

animation-play-state：runnimg/paused； 动画运行或暂停，默认running