今天完成的事情：

任务14，轮播图导航栏。

明天计划的事情：

任务14做完第一个页面

遇到的问题：

轮播图问题，轮播图不能被挤下去，是因为我上面有宽度，把他挤破了，但是实际宽度没有那么多，所以就被轮播图覆盖了，还有就是导航栏问题，导航栏一开始我吧它和input复选框绑定，但是因为复选框没有放好，所以就一直没有生效。

   <div class="nav">
        <input type='checkbox' id='sidemenu'>
    <img  class="img-jinshu" src="../img/task8.3.png" height="50" width="107"/>
        <div id='wrap-box'>
        <label  for='sidemenu'>
            <img  class="flexible " src="../img/task13 (1).png" height="30" width="34"/></label>
</div>

        <ul  class="topnav">
                <li><a href="https://maikihyh.github.io/task/html/task14.html">关于</a></li>
                <li><a href="https://maikihyh.github.io/task/html/task15.html">推荐</a></li>
                <li><a href="https://maikihyh.github.io/task/html/task15.1.html">职业</a></li>
                <li><a  href="https://maikihyh.github.io/task/html/task14.html">首页</a></li>
     </ul>
</div>

把复选框放入导航栏里面，就产生了效果。

还有就是aside标签aside为语义化标签，通常用来描述与文档主体内容不相关的内容。比如，博客文章用atricle标签，而博客旁边的文章信息栏(作者头像、博文分类、作者等级等于博客正文内容无关的)用aside。百度知道是问答网站，主体就是提问和回答，所以提问回答这边是用article，而右边那个用户信息、升级进度，广告和推荐的知识那些与该问题的回答和提问内容都无关，与主题内容不相关的区域用的就是aside。简单的说aside可用作通用信息展示（信息栏）等。

还有就是复选框，复选框我用的了

ul.topnav li {
  float: left;
}
ul.topnav li a {
  display: block;
  color: white;
  text-align: center;
  padding: 18px 16px;
  text-decoration: none;
  border-bottom: 2px solid $color;
  font-size: ($font*0.8);
}
ul.topnav li a:hover:not(.active) {
  border-bottom: 2px solid $color1;
}
ul.topnav li.right {
  float: right;
}

改完之后，关联一起加上一个点击按钮。

accesskay：（一般很少用）
   功能：定义访问这个控件的热键。 
   用法：<label for="InputBox" accesskey＝"N">姓名</label><input id="InputBox" type="text"> 
   局限性：accessKey属性所设置的快捷键不能与浏览器的快捷键冲突，否则将优先激活浏览器的快捷键。 

<label> 标签为 input 元素定义标注（标记）。

label 元素不会向用户呈现任何特殊效果。不过，它为鼠标用户改进了可用性。如果您在 label 元素内点击文本，就会触发此控件。就是说，当用户选择该标签时，浏览器就会自动将焦点转到和标签相关的

收获：

学到了轮播图，导航栏纯css写出来。