今天完成的事情：

▶用bootstrap重写了任务6，一边写一边熟悉了各种样式和组件的用法。

a.按钮的用法

<button type="button" class="btn-default"></button>

这里一定要注意不能忘记type="button",class的样式有很多种，直接拿来用，后期调整下就可以了。

b.图片的用法

<img src="#" class="img-responsive">

这里加img-responsive是为了让图片支持响应式设计。

c.下拉菜单的用法

<div class="dropdown">

      <button type="button" class="btn dropdown-toggle" id="dropdownMenu1" data-toggle="dropdown">

          测试文字

          <span class="caret"></span>

      </button>

      <ul class="dropdown-menu" role="menu" aria-labelledby="dropdownMenu1">

      <li role="presentation">

          <a role="menuitem" tabindex="-1" href="#">测试文字1</a>

      </li>

</div>

* 其中dropdown就是指下拉；

* id是为了指向某个二级菜单，因为多数情况下不止一个菜单；

* data-toggle是指数据切换，目的是将<button>标签的属性转换为下拉菜单的属性，是必不可少的；

* caret就是指下拉菜单的小三角形；

* role这个属性我查询到是给搜索引擎和浏览器看的，是一个语义化属性,本身单词的意思是“作用”，在bootstrap的表单中也有role="form"；

* aria-labelldby这个属性是给读屏软件用的，目标是视觉障碍人士；

* presentation的意思是“提交”;

* tabindex这个属性是指TAB键的焦点顺序问题，默认为0，如果不同的元素tabindex值相同的情况下，以html出现的先后顺序为准，当值为“-1”时，是指在使用TAB键时此元素被忽略。

d.列表的用法

<ul class="list-unstyled">是指清楚ul的默认样式，相当于list-style:none。

明天计划的事情:

1.要开始任务7了，在任务6上面耗了太久时间了，不过收获还是很多的。

2.继续学习bootstrap。

遇到的问题：

就一个问题，当元素A使用position：fixed时,脱离了文档，后面紧接着的元素B肯定会上移，这样A就遮盖了B，我之前的处理方法是在B元素之前加一个空的div元素，高度与A元素一样，但是很多时候A元素的高度并不是确定的，而是由A元素的content来撑开的，而且还会随着width的变化而变化，这个时候我们要如何去添加这个空的div元素？

然后我查询资料还有另一种办法就是设置B元素的margin-top的值与A元素的height一样，还是要涉及高度问题，有没有另外更好的办法去使这个B元素不被A元素遮盖，而且还是紧贴着A元素的？

收获：

1.熟悉了bootstrap的一些基本样式及布局组件。

2.学会了如何用bootstrap去写下拉菜单和按钮。

3.学会了如何上传服务器后添加正确的文件路径。