今天完成的事情：

发现之间做的任务没有用栅格布局，用栅格布局重新做了一次

下拉菜单做的不够好，需要里面的文字居中并且缩小宽度。一直都没找到解决方案，在何阳的帮助下给<li>加上了弹性布局，但是发现宽度一直无法改变，然后给ul加了

min-width:100px;

因为bootstrap自带的属性影响了，就写个属性覆盖。

在栅格布局中当col前面的部分不加东西想要空出来时加上"col-md-offset-8"

用border-image: linear-gradient(white,#999999,white)2; 可以设置渐变边框

明天计划的事情：

工欲善其事必先利其器，明天好好学习下F12、webstorm的快捷用法

布局任务7页面一

遇到的问题： 

写代码的时候发现.col-md-用不了，改用.col-xs-。

这是电脑上的

这是手机上的，发现背景图片总是会移动

尝试额外设置一个<div>

<button type="button" class="btn btn-defaultsy">
    <div class="footbox">
    </div>
    <p>首页</p>
</button>

再给<div>设置背景图片

依然有偏差。

收获：

布局容器

.container（固定宽度）类用于固定宽度并支持响应式布局的容器。

.container-fluid （100% 宽度）类用于 100% 宽度，占据全部视口（viewport）的容器。

<div class="container"><div>能随着屏幕分辨率改变自身宽度大小。

container 类和container-fluid类的区别体现在是否有随视口宽度改变的margin存在（container有margin）。 

container类所谓的自适应也是通过margin的改变来完成，container-fluid类的百分百宽度是指在固有的15px的padding前提下宽度总是当前视口的宽度。

行row必须在.container,.congtainer-fluid中，以便赋予合适的排列aligment和内部padding

行row在水平方向创建一组列column

内容应当让放置于列col内，只有列col可以作为row的直接子元素

为列col设置padding属性，从而创建列与列之间的间隔gutter。

通过为.row元素设置负值margin从而抵消掉为.container元素设置的padding,也就间接为行row所包含的列col抵消掉了paddingow所包含的列col抵消掉了padding

进度：task7

任务开始时间：2018.05.13

预计结束时间：2018.05.17

是否有延期风险：无

禅道：无