mirror of
https://github.com/tenrok/bootstrap.git
synced 2026-06-05 16:42:29 +03:00
add docs for sub menu support on dropdowns, add caret via :after to submenu toggles
This commit is contained in:
+43
-12
@@ -51,16 +51,7 @@
|
||||
<li><a tabindex="-1" href="#">{{_i}}Another action{{/i}}</a></li>
|
||||
<li><a tabindex="-1" href="#">{{_i}}Something else here{{/i}}</a></li>
|
||||
<li class="divider"></li>
|
||||
<li class="dropdown-submenu">
|
||||
<a tabindex="-1" href="#">{{_i}}Separated link{{/i}}</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li><a tabindex="-1" href="#">{{_i}}Second level link{{/i}}</a></li>
|
||||
<li><a tabindex="-1" href="#">{{_i}}Second level link{{/i}}</a></li>
|
||||
<li><a tabindex="-1" href="#">{{_i}}Second level link{{/i}}</a></li>
|
||||
<li><a tabindex="-1" href="#">{{_i}}Second level link{{/i}}</a></li>
|
||||
<li><a tabindex="-1" href="#">{{_i}}Second level link{{/i}}</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li><a tabindex="-1" href="#">{{_i}}Separated link{{/i}}</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>{{! /example }}
|
||||
@@ -91,10 +82,50 @@
|
||||
</pre>
|
||||
|
||||
<h2>{{_i}}Options{{/i}}</h2>
|
||||
<p>{{_i}}...{{/i}}</p>
|
||||
<p>{{_i}}Align menus to the right and add include additional levels of dropdowns.{{/i}}</p>
|
||||
|
||||
<h3>{{_i}}Aligning the menus{{/i}}</h3>
|
||||
<p>{{_i}}...{{/i}}</p>
|
||||
<p>{{_i}}Add <code>.pull-right</code> to a <code>.dropdown-menu</code> to right align the dropdown menu.{{/i}}</p>
|
||||
<pre class="prettyprint linenums">
|
||||
<ul class="dropdown-menu pull-right" role="menu" aria-labelledby="dLabel">
|
||||
...
|
||||
</ul>
|
||||
</pre>
|
||||
|
||||
<h3>{{_i}}Sub menus on dropdowns{{/i}}</h3>
|
||||
<p>{{_i}}Add an extra level of dropdown menus, appearing on hover like those of OS X, with some simple markup additions. Add <code>.dropdown-submenu</code> to any <code>li</code> in an existing dropdown menu for automatic styling.{{/i}}</p>
|
||||
<div class="bs-docs-example">
|
||||
<div class="dropdown clearfix">
|
||||
<ul class="dropdown-menu" role="menu" aria-labelledby="dropdownMenu" style="display: block; position: static; margin-bottom: 5px;">
|
||||
<li><a tabindex="-1" href="#">{{_i}}Action{{/i}}</a></li>
|
||||
<li><a tabindex="-1" href="#">{{_i}}Another action{{/i}}</a></li>
|
||||
<li><a tabindex="-1" href="#">{{_i}}Something else here{{/i}}</a></li>
|
||||
<li class="divider"></li>
|
||||
<li class="dropdown-submenu">
|
||||
<a tabindex="-1" href="#">{{_i}}More options{{/i}}</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li><a tabindex="-1" href="#">{{_i}}Second level link{{/i}}</a></li>
|
||||
<li><a tabindex="-1" href="#">{{_i}}Second level link{{/i}}</a></li>
|
||||
<li><a tabindex="-1" href="#">{{_i}}Second level link{{/i}}</a></li>
|
||||
<li><a tabindex="-1" href="#">{{_i}}Second level link{{/i}}</a></li>
|
||||
<li><a tabindex="-1" href="#">{{_i}}Second level link{{/i}}</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>{{! /example }}
|
||||
<pre class="prettyprint linenums">
|
||||
<ul class="dropdown-menu" role="menu" aria-labelledby="dLabel">
|
||||
...
|
||||
<li class="dropdown-submenu">
|
||||
<a tabindex="-1" href="#">{{_i}}More options{{/i}}</a>
|
||||
<ul class="dropdown-menu">
|
||||
...
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
</pre>
|
||||
|
||||
</section>
|
||||
|
||||
|
||||
|
||||
Reference in New Issue
Block a user