18 Star 32 Fork 2

LCUI 开发 / lc-design

加入 Gitee
与超过 1200万 开发者一起发现、参与优秀开源项目,私有仓库也完全免费 :)
免费加入
克隆/下载
dropdowns.md 1.33 KB
一键复制 编辑 原始数据 按行查看 历史
liu 提交于 2019-07-28 17:51 . refactor: rename to LCDesign, update xml code

Dropdowns

Toggle contextual overlays for displaying lists of links and more with the LCUI dropdown component.

Overview

Dropdowns are toggleable, contextual overlays for displaying lists of links and more. They’re toggled by clicking, not by hovering; this is an intentional design decision.

Examples

<w class="btn" data-toggle="dropdown" data-target="dropdown-example-1">
  <text>Dropdown button</text>
  <icon name="chevron-down" />
</w>
<dropdown-menu id="dropdown-example-1">
  <text class="dropdown-item">Action</text>
  <text class="dropdown-item">Another action</text>
  <text class="dropdown-item">Something else here</text>
</dropdown-menu>

Menu headers

Add a header to label sections of actions in any dropdown menu.

<w class="dropdown-menu">
  <h6 class="dropdown-header">Dropdown header</h6>
  <text class="dropdown-item">Action</text>
  <text class="dropdown-item">Another action</text>
</w>

Menu dividers

Separate groups of related menu items with a divider.

<w class="dropdown-menu">
  <text class="dropdown-item">Action</text>
  <text class="dropdown-item">Another action</text>
  <text class="dropdown-item">Something else here</text>
  <w class="dropdown-divider"></w>
  <text class="dropdown-item">Separated link</text>
</w>
C
1
https://gitee.com/lcui-dev/lc-design.git
git@gitee.com:lcui-dev/lc-design.git
lcui-dev
lc-design
lc-design
develop

搜索帮助