发表于： 2018-09-18 09:24:31
1 806
今天完成的事情：
1. 利用 Bootstrap 和自定义样式完成任务6页面。
明天计划的事情：
1. 学习雪碧图，并重写任务6的相关代码。
2. 开始任务7的页面编写。
遇到的问题：
1. Bootstrap 中 nav-tabs 的下拉菜单太宽，在窄屏幕下无法完全展示。在开发者模式下，审查相关元素的属性，发现dropdown-menu 的 min-width 太大，将其改为适当的大小后即可。
2. 在做筛选栏时，利用无序列表的样式，宽度过小，无法随浏览器宽度自适应宽度，且各选项的宽度不一致。
解决： 往 ul 元素添加 fill 的 class 以扩充宽度，同时添加 nav-justified 以保证各选项的宽度一致。
收获：
收获主要在于学习 Bootstrap 的使用，并利用它完成任务页面。主要在于：
1. 利用 nav, nav-bar 和 nav-tabs 等完成筛选栏。
2. 使用 dropdown 组件实现下拉菜单，同时也学会使用:hover 选择器实现原生 CSS 下拉菜单。
3. 学习 Bootstrap 的 table 内容，完成页面的信息流部分。其中包括 table 的嵌套、表格内容的水平及竖直居中等等
返回列表
评论