今天完成的事情：

任务12基本完成，任务12主要是重写，用sass变量和嵌套，然后我用的还是flex。

明天计划的事情：

准备做任务13。

遇到的问题：

下拉框改变样式，

.dropdown-box{
  border: none;
  outline:none;
  line-height: ($size*0.6);
  padding-right: 37px;
  border-right: ($size/40) solid $color2;
  font-size:($font*0.8) ;
  background-image: url("../img/task6.png");
  background-repeat:no-repeat;
  background-position:55px 5px ;
  color: $color3;
  -webkit-appearance:none;
}

虽然改变了输入框样式，但是输入框仍然是那么大，无法做到适应屏幕，看出来效果并不是很好看，

还有其他去掉样式的

第一种：直接在input中加style=“outline:none;”

<input type="search" style="outline:none;:>

第二种方式：在顶部style中直接控制css样式：

<style type="text/css">
input{outline:none;}
</style>

第三种方式：直接用 input:focus { outline: none; } 控制聚焦时不出现蓝色边框~

input:focus { outline: none; }

display: flex;
align-items: center;
justify-content: space-between;
position: fixed;
z-index:999999;
width: 100%;
top:0;
max-width: 760px;
height: $size;
background-color:$color;
font-size: ($font*0.8);

导航栏我是用flex写的，因为居中的问题，我加了一个空的div，然后用布局箭头符号，是可以引图片，我是写了一个div，然后使用，写出来是比较麻烦的，没有直接引图片，更容易自适应，更容易改。

收获：