今天完成的任务：1.完成任务十一。

2.写完任务十二。

3.初步学会自行建立组件。

明天计划的事情：

1.完成任务12.13.

遇到的困难：

   1.今天晚上总共遇到2个问题。第一个问题是媒体查询失效的问题。用了半个小时的时间才发现原来是因为<meta>标签中少了viewport，导致媒体查询失效。

   2.li标签存在默认间距问题。之前对body虽然设置了font-size:0;但是用google浏览器f12查看，就发现body中的font-size:0;不知道怎么回事竟然失效了。后来就直接对li标签的父元素ul标签设置font-size:0;从而解决li标签默认间距。

收获：主要是初步学会自己制作css组件。现在只做了一部分，还不是很完善，以后继续完善自己的组件功能，方便以后使用。

.p_r {
  position: relative;
}
.p_a {
  position: absolute;
}
.p_f {
  position: fixed;
}
.f_l {
  float: left;
}
.f_r {
  float: right;
}
.d_i_b {
  display: inline-block;
}
.d_b {
  display: block;
}
.flex_middle {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
}
.vertical_middle {
  vertical-align: middle;
}

.m_center{
  margin: 0 auto;
}
.t_center {
  text-align: center;
}
.f_white {
  color: #FFF;
}
.f_gray {
  color: #999;
}
.f_blue{
  color: #5FC0CD;
}
.f_red{
  color: #E63B0E;
}
.b_blue{
    background-color: #5FC0CD;
}

https://fengcol.github.io/start-a-project/task11/task11.html

https://fengcol.github.io/start-a-project/task12/task12.html