发表于： 2019-01-08 09:11:33
1 751
今天完成的事情：
学习bootstrap
用bootstrap实现下拉菜单的功能
在bootstrap 官网查到drop down 的基本用法
并自己改造 用div 实现 ，依旧用flex 布局
使用方式：
每一个下拉框以dropdown 为最外层单位。
然后分为 显示部分和下拉部分
显示部分：用带 data-toggle="dropdown"的元素包含要显示的内容。
下拉部分：用带 class="dropdown-menu的元素 包含 class="dropdown-item的子元素。
这次任务我在显示部分加了个 dropdown-title ,设置为：
里面放3个元素。其中第一个为空，第二个为显示内容，第三个为 下拉图标。从而达到设计图要求。
也许有更好的实现方法，但为了充分练习flex 特性，想了很久才想出用空元素占位。
改写下拉选单的显示部分，实现与父元素同等宽度且文字居中
明天计划的事情：
看任务07
遇到的问题：
有一个扩展问题：
想实现hover 弹出下拉菜单，但不太明白通常情况是怎么做的。
是直接写CSS 伪类 还是专门写一段js来控制。
收获：
bootstrap 下拉框 的使用与自定义改写。
返回列表
评论