任务七的新知识点一个是audio属性，audio标签是用来定义声音，有了这个标签我们就可以简单的在网页中引入背景音乐，audio标签有很多属性值‍‍autoplay：如果设置该属性，音频将自动播放，值为：autoplay；controls：如果设置该属性，则显示音频控件（播放/暂停按钮），值：controls；loop：如果设置该属性，则音频重复播放，值为：loop；muted：如果设置该属性，则音频输出为静音，值：muted；preload：规定当网页加载时，音频是否默认被加载以及如何被加载。值：auto/metadata/none；src：规定音频文件的地址；我把所有的属性都实验了一下，但是autoplay这个属性不知道为啥一直无效。我学到的第二个知识点是‍‍opacity 属性设置元‍‍素的不透明级别，包括背景色,前景色还有边框都会受到影响，字元素也会被包含在内。取值范围为0到1，0为完全透明，1为完全不透明。学到的第三个属性‍‍是transform，这个属性是设置元素‍‍改变，使…变形；转换‍‍，可以使元素左右上下移动或者90度180度的旋转，等比例放大甚至可以倾斜旋转。任务七第二个页面的音频部分就是用这3个属性一起做的，首先引入需要的音频，因为controls属性会显示一个播放器，这个播放器的播放键在左边但是想要让它到右边去，‍‍用transform: rotate(180deg);属性翻转180度最后在用opacity让播放器透明。‍

我还学会了2个单位vw和vh，vw和vh‍‍主要用于页面视口大小布局，‍‍视窗宽度，1vw等于视窗宽度的1%，1vh等于视窗高度的1%。虽然vw和vh都是百分比，但是他和单位百分比还是不同的，百分比‍‍是元素相对于父级的宽度或高度的百分比，比如说一个元素width为100px他的子元素设置为width：50%那就是50px。‍

但是要是设置成50vw那就是根据屏幕的大小了，屏幕要是1000px子元素width就是500px了。

任务十的导航部分开始的时候我是参考师兄的写法，在nav的这个父元素里写一个导航标志，和UL列表，然后，写一个hover伪类，但是这样写有一个问题就是鼠标移动到导航的各个位置导航栏都会弹出来，而我之前写的任务八九确是鼠标点击导航标志，导航栏才会弹出来。之前写任务十三的向左弹出的导航时有了一个灵感可以用兄弟选择器，这样就可以实现只点击导航图标才弹出导航。首先我把UL导航栏列表跟导航图标并列然后修改了伪类选择器，在伪类里加上兄弟选择器这样就实现了只点击图标才弹出导航栏的效果。