今天完成的事情：

完成任务8.1静态页面布局，并没有实现自适应

明天计划的事情：

1.实现8.1自适应；

2.完成任务8.2，8.3

遇到的问题：

1.将一个div均分五份：

<div>

            <div class="index-company-box index-company1"></div>

            <div class="index-company-box index-company2"></div>

            <div class="index-company-box index-company3"></div>

            <div class="index-company-box index-company4"></div>

            <div class="index-company-box index-company5"></div>

</div>

.index-company-box{

    margin: 0;

    padding: 0;

    font-size: 0;

    width: 20%;

    height: 1.6rem;

}

如上，转为行内块元素之后，div直接有margin值，不明所以。

解决方式：

1.使用float来实现，

.index-company-box{

    /*margin: 0;*/    没有清边距是因为public.css已经清过

    /*padding: 0;*/

    /*display: inline-block;*/

    /*font-size: 0;*/

    float: left;

    width: 20%;

    height: 1.6rem;

}

2.

大师兄告诉我们：line-block 元素之间会莫名其妙多出3px的间距，其实这个是换行符，如果将 inline-block 元素间的换行符去掉，这3px的间距就会消失了。 有没有在不影响代码美观的情况下去掉间距尼，答案是有的。可以在inline-block的父元素中加上 font-size：0，这样可以点消除inline-box元素直接的margin值，实现同行显示。

收获：

将元素设置成inline-block属性后，元素之间会产生3px 的margin值，将字体设为font-size：0可消除影响。