一个菜单上可以显示不同的下拉菜单,本案例仅用于演示效果
XML/HTML Code
- <div class="container">
- <button data-dropdown="#basic" class="btn btn-danger">Basic</button>
- <div class="dropdown-menu dropdown-anchor-top-left dropdown-has-anchor" id="basic">
- <ul>
- <li><a href="#">Item 1</a></li>
- <li><a href="#">Item 2</a></li>
- <li class="divider"></li>
- <li><a href="#">Item 3</a></li>
- </ul>
- </div>
- <button data-dropdown="#dark" class="btn btn-danger">Dark Theme</button>
- <div class="dropdown-menu dropdown-anchor-top-left dropdown-has-anchor dark" id="dark">
- <ul>
- <li><a href="#">Item 1</a></li>
- <li><a href="#">Item 2</a></li>
- <li class="divider"></li>
- <li><a href="#">Item 3</a></li>
- </ul>
- </div>
- <button data-dropdown="#right" class="btn btn-danger">Right Dropdown</button>
- <div class="dropdown-menu dropdown-anchor-left-center dropdown-has-anchor dark" id="right">
- <ul>
- <li><a href="#">Item 1</a></li>
- <li><a href="#">Item 2</a></li>
- <li class="divider"></li>
- <li><a href="#">Item 3</a></li>
- </ul>
- </div>
- <button data-dropdown="#noanchor" class="btn btn-danger">Without Anchor</button>
- <div class="dropdown-menu dropdown-anchor-top-left" id="noanchor">
- <p>Any content here</p>
- </div>
- </div>
原文地址:http://www.freejs.net/article_daohangcaidan_565.html