今天完成的事情：

        舍弃BS框架并重写任务六的header按钮组
        初步完成任务七第一张页面

明天计划的事情：

        继续重写任务六的下拉框（舍弃BS框架）
        继续任务七
遇到的问题：

        舍弃BS框架并重写任务六的header按钮组时发现虽然可以用普通按钮button写出一个按钮组来，但是没有切换效果，后来百度到了用radio+label的组合来实现切换效果，还犯了个低级错误，重复复制了一个label元素，但是属性忘记改了，导致无切换效果，多花了一些时间来debug。
        在写任务七页面时，由于header元素使用了fixed，所以导致main元素无法紧跟其后，出现在页面顶部，而后用了margin-top来定位，但是当子元素也用margin-top时却无作用，原来是重叠了，后来也用了fixed定位

收获：

       1. 选项卡切换效果可以用纯css来写，例如：

<div class="female"> 

     <input type="radio" id="female" name="sex" /> 

      <label for="female">女</label>

</div>

<div class="male">

 <input type="radio" id="male" name="sex" /> 

      <label for="male">男</label>

</div>

添加样式：input[type="radio"]:checked + label{
    background-color: #01cd78;
    background-clip: content-box;
    padding: .2em;
}

以上原理是通过添加input[type="radio"]:checked + label来实现input和label的绑定，产出切换效果。

2.如何用纯css写出小三角？

 <!-- 向上的三角形 -->

<div class="triangle_border_up">

      <span></span>

</div>

/*向上*/

.triangle_border_up{

    width:0;

    height:0;

    border-width:0 30px 30px;

    border-style:solid;

    border-color:transparent transparent #333;/*透明 透明  灰*/

    margin:40px auto;

    position:relative;

}