今天完成的事情，任务13游戏第三张图。

侧边栏导航。

侧边栏懵了很长时间，需要隐藏复选框，绑定aside标签。然后设置复选框的按钮样式与动画效果。在网上找到了例子，找这例子尝试慢慢去理解，虽然做出来了，但是感觉还是不是很懂。

第二张图杀人游戏做完的时候，在wiki上看了一下师兄做得，发现页头有一个类似动画效果的感觉。

看了很久之后发现不是动画效果，而是页头的投票页，用到了固定定位，发言讨论使用相对定位。

vote设置了 position：fixed。

hint：position：relative。

相对定位，元素会偏移一定的距离，但是元素在原来的位置，仍然占据空间

所以下拉的时候，投票内容因为是固定定位，固定定位不会根据滚动条所变化，牢牢的定在那里，所以被发言讨论的内容所覆盖。

设置音频发现，把父级设置为相对定位，子级绝对定位的情况下。设置隐藏opacity: 0，

添加背景图片之后，发现不能百分之百点击到播放按钮。

如果播放器能够倒过来得话，就可以很容易点击，

transform: rotate(180deg);

transform设置动画效果，rotate（180deg）倒转180°。

今天学到的知识，任务13基本上没有什么太大的难度，除了侧边栏是新知识。但是今天还是用了一天，还差一点写完，休息了很长时间，感觉好多知识忘的差不多了。今天学习了关于transform动画效果，设置侧边栏的时候，

关于<asdie>标签定义所处内容之外的内容。

adsdie的内容应该与附近的内容相关。

<asdie>的内容可用 作文章的侧栏。

transition: 0.2s ease-out;设置动画效果为渐变式，速度为0.2s。侧边栏虽然做出来了感觉还是没有吃透。

明天计划，完成任务13。