发表于： 2019-06-28 23:01:03
1 756
今天完成的事情：做了任务8三个页面基本做完，拆解bootstrap样式原理
明天计划的事情：拆解bootstrap样式原理，做响应式，重构任务8
遇到的问题：
使导航悬停2个字变成4个字的同时下边框出现在底部
控制导航栏菜单宽度，溢出隐藏，悬停增加宽度实现2个字变成4个字，但是需要给菜单设置高度才能实现这个功能，不然就换行了，控制高度后下边框就只是在字下边了，到不了底部
出现这个问题是因为子级承载太多属性，把一些属性给父级即可，还有ul的高度和导航栏高度不一致
拆解bootstrap样式原理
1、导航栏
折叠
button
通过媒体查询用display:none隐藏
<button data-toggle="collapse"（点击触发折叠）data-target="#ID"(转到指定目标)>
菜单
折叠情况下
父级{flex-wrap:wrap;}折行
子级{flex-basis:100%;}宽度100%
区域 :not(身份){display:none;}这个区域里不是这个身份的都隐藏
展开
父级{flex-wrap:nowrap;}
子级{flex-basis:auto;}
返回列表
评论