今日完成的任务：

改了改任务8-3

把任务8的三个页面给师兄检查了一下，然后询问了一下要修改的东西和建议

对三个页面进行了一些细节的修改，例如导航栏按钮下拉时水平居中，文字与表格分离开，底部留白

对于bootstrap中的栅格做了一些小demo

对于一个栅格的子元素宽度设置成百分之百之后到底包不包含padding的宽度

css：

.a{

height: 200px;                                                    

background: red;

box-sizing: content-box;

border: 1px solid blue;

}

.b{

width: 100%;

background-color:black;

height: 100px;

}

html

<div class="container">

<div class="row">

<div class="col-lg-3 col-md-3 col-sm-3 a">

<div class="b">

</div>

</div>

<div class="col-lg-3 col-md-3 col-sm-3 a">

<div class="b"></div>

</div>

<div class="col-lg-3 col-md-3 col-sm-3 a">

<div class="b"></div>

</div>

</div>

</div>

确实跟自己学到的知识一致，但是任务8-3中的鼠标悬停出现简介的那个页面100%的宽度却包含了padding的部分，百度没找到答案，思考了一下，感觉跟绝对定位的位置有关，但是设置了position：15px 0之后，width左移左边的15px消失，右边的15px仍然在，最后设置了负的margin总算是解决了，但是没怎么弄清楚原因。

4.学习了一下box-sizing的知识

‍‍‍‍content-box，border和padding不计算入width之内‍‍

padding-box，padding计算入width内‍‍

‍‍border-box，border和padding计算入width之内，其实就是怪异模式了‍‍

而且在栅格系统中使用这个，border-box比content-box的要小30px

明日计划完成的任务：

完成任务9开始做任务10，学习less或者sass

遇到的困难：

见上，还有代码长了之后找到选择器和修改代码非常困难

收获:以后得严格按照代码规范来，代码长了之后太不人性化了，取名也要规范化