今天完成的事情： 

      使用有序列表ul，li结构模拟下拉框。

      使用width百分比等分下拉框。

      使用display： none；属性隐藏下拉内容。

      使用hover选择器使下拉框被点击时隐藏内容可见。

.dropdown {
    position: relative;
    height: 25px;
    width: 33%;
    border-right:1px solid #bababa;
    text-decoration: none;
    text-align: center;
    align-items: center;
    background: url("img/形状 1 拷贝.png") no-repeat 98% center ;

}
.box-1 {
    display: block;
    text-align: center;
}
.dropdown-content {
    display: none;
    position: absolute;
    width: 100%;
    border-bottom:1px solid  whitesmoke ;
    list-style: none;
    background-color: #ffffff;
}

.dropdown:hover .dropdown-content {
    display: block;

}

      图标作为背景图片使用放入盒子。

      背景属性简写background: url(“orz.png”)  no-repeat  5px 5px;

      左右定宽中间flex： 1；自适应。完成中间内容大致布局。

      justify-content：space-around；属性实现footer图标分布。

 下拉框和中间内容因为需设置的属性重复所以引用了同一处代码，不知道会不会有影响。

明天计划的事情：

      解决下拉框下拉内容向右偏离问题。

      解决footer中间图标显示问题，不知道是不是切图没切好，没能切出完整的图标，尝试是否能用ps合并图标，和使用盒子背景代替图标的椭圆形状。

遇到的问题：

    下拉框下拉内容向右偏离。

    body中间三栏模块右边文字与图标无法对齐。

    footer中间图标显示问题。

   模拟下拉框标签被黄色光标笼罩，不知道是不是格式有问题。

收获：