今天完成的事情：

        开始任务10，

1.学习了解用css将浏览器默认的下拉框样式清除，

select {
  /*Chrome和Firefox里面的边框是不一样的，所以复写了一下*/
  border: solid 1px #000;

  /*很关键：将默认的select选择框样式清除*/
  appearance:none;
  -moz-appearance:none;
  -webkit-appearance:none;

  /*在选择框的最右侧中间显示小箭头图片*/
  background: url("http://ourjs.github.io/static/2015/arrow.png") no-repeat scroll right center transparent;


  /*为下拉小箭头留出一点位置，避免被文字覆盖*/
  padding-right: 14px;
}


/*清除ie的默认选择框样式清除，隐藏下拉箭头*/
select::-ms-expand { display: none; }

 2 学习

           1 .<label>元素添加生成性内容(伪元素)，并基于单选按钮的状态来为其设置样式；

               2. 然后把真正的单选按钮隐藏起来； 

                3. 最后把生成内容美化一下。

案例图：

学习了解  

CSS clip 属性

明天计划的事情：继续任务十，有个select下拉框，预计用div加checkbox来模拟下拉。

遇到的问题：

  1  .  ，登录和注册默认为注册当前这种样式，想要点击登录时，登录变为图中状态，注册不变，点击注册时，注册变为登录图中样式，登录回复原样。即模拟实际用户操作状态，伪类无法实现，虽然可以变色，但是点击别处就样式消失了。

          使用label和radio实现。利用radio的选择不可取消。

2.想要实现点击选择箱型里的按钮时，定制箱型变色，以下类推。没想到解决方法，

收获：学会修改radio样式，添加自己选择圆点，清除select默认样式，

          clip裁剪图形。遵循规则：上右下左