bootstrap下拉菜单同一水平行上的两个链接 [英] bootstrap dropdown menu Two links on same horizontal row

查看:107
本文介绍了bootstrap下拉菜单同一水平行上的两个链接的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我正在使用Bootstrap制作下拉菜单.我想拥有的选项之一是下拉菜单中同一水平行上的两个链接.我将如何实现呢?

I'm using Bootstrap to make drop down menus. One of the options I would like to have is two links on the same horizontal row in a dropdown menu. How would I achieve this?

<div class = "navbar">
<div class = "navbar-inner">

<li class = "dropdown">
    <a href="#" class="dropdown-toggle" data-toggle="dropdown"> Dropdown Button
        <b class="caret"></b>
    </a>

    <ul class = "dropdown-menu" role="menu" >
        <li><a href="#">On First Row</a></li>
        <li><a href="#">On Second Row</a></li>
        <li><a href="#">On Third Row</a><a href="#">Also On Third Row</a></li>
</ul>
</li>
</div>
</div>

推荐答案

您解决的代码在这里>>>>> 一个下拉列表项中的两个链接

Your solved Code is here >>>>> two links in one dropdown list item

html

    <div class="navbar">
    <div class="navbar-inner">
        <li class="dropdown"> <a href="#" class="dropdown-toggle" data-toggle="dropdown"> Dropdown Button
        <b class="caret"></b>
    </a>

            <ul class="dropdown-menu" role="menu">
                <li><a href="#">On First Row</a>
                </li>
                <li><a href="#">On Second Row</a>
                </li>
                <li class="hz"><a href="#">On Third Row</a><a href="#">Also On Third Row</a>
                </li>
            </ul>
        </li>
    </div>
</div>

css

.open> ul>li.hz{
    display: inline-flex !important;
}

这篇关于bootstrap下拉菜单同一水平行上的两个链接的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆