今日所做：

1.尝试用css去做响应式导航栏，分析了一下导航栏的构成元素，分别为企业logo、

屏幕宽度缩小时出现的按钮以及下拉菜单这三部分

2.屏幕宽度发生变化时，logo的位置基本是不改变的，所以不需要做调整；位置发生

变化的是按钮和下拉菜单这两部分，因此需要对这两部分进行设置

3.对于按钮是大屏幕时不出现，当屏幕缩小时出现，因此可以先给按钮设置好位置，然后

display：none，然后设置媒体查询，当宽度小于某个值时，让按钮显现，就可以了

4.对于下拉菜单部分，大屏幕状态下子菜单水平排布，小屏幕的状态下点击按钮实现下拉菜单；

那么还是在大屏幕宽度下安放好菜单的位置，然后设置媒体查询，使得屏幕宽度小于某个值时

触发下拉菜单display：none，让它消失；然后给按钮设置focus功能，使得鼠标点击的时候，

下拉菜单出现；此外，两种屏幕宽度下，对下拉菜单的布局样式是不一样的，需要再媒体查询

的时候设置具体的微调

5.除了轮播图，完成了第一个页面的其他模块的响应式布局

明日计划：

研究轮播图，继续进行其他页面的布局

遇到的问题：

在用css制作响应式导航栏的时候，想要通过点击按钮触发某个模块的样式改变以及定位变化，

最初想到的是使用hover伪类，但是hover只能是鼠标滑到按钮时触发，离开按钮就不行了，不最终效果；

之后改成了focus，比hover稍微强一些，即点击按钮的时候导航栏可以一直在那停着，但是，想让导航栏

再收回去点击按钮是不行的，需要点击其他的地方，这就离最终的效果还是有一定区别，不知道有什么方法

可以实现第一次点击按钮改变样式，再点击一次样式还能变回去