无法识别这个"箭头"在Bootstrap下拉菜单中

时间:2015-06-08 12:53:49

标签: html css twitter-bootstrap

我想知道这个"箭头"是。 Image Link.

bootstrap arrow

我假设它来自Bootstrap,但我甚至不确定这是否属实。当光标悬停在光标上或单击它以显示下拉菜单后,它会消失。任何帮助将不胜感激。

菜单Html:

          <nav class="navbar navbar-default">
                <div class="navbar-header">
                    <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1">
                        <span class="sr-only">Toggle navigation</span>
                        <span class="icon-bar"></span>
                        <span class="icon-bar"></span>
                        <span class="icon-bar"></span>
                    </button>
                    <div>@Html.ActionLink("Main", "Main", "Home", null, new { @class="navbar-brand"} )</div>
                </div>

                <!-- Collect the nav links, forms, and other content for toggling -->
                <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
                    <ul class="nav navbar-nav">
                        <li class="dropdown">
                            <a class="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false">Folder <span class="caret"></span></a>
                            <ul class="dropdown-menu" role="menu">
                                <li>@Html.ActionLink("Search", "Index", "Folder")</li>
                                <li>@Html.ActionLink("Create New", "Create", "Folder")</li>
                            </ul>
                        </li>
                    </ul>
                </div><!-- /.navbar-collapse -->
           </nav>

菜单CSS:

   .navbar, .navbar-default {
    margin-bottom: 0px;
    margin-left: -7px;
    background-color: #445f75;
    vertical-align: middle;
    font-weight: bold;
    font-family: arial;
    font-size: 14px;
    height: 35px;
    border-style:none;
    background-image: -webkit-gradient( linear, left top, left bottom, color-stop(1, #445F75));
    background-image: -o-linear-gradient(bottom, #445F75 0%, #5B7487 100%);
    background-image: -moz-linear-gradient(bottom, #445F75 0%, #5B7487 100%);
    background-image: -webkit-linear-gradient(bottom,#445F75 0%, #5B7487 100%);
    background-image: -ms-linear-gradient(bottom, #445F75 0%, #5B7487 100%);
    background-image: linear-gradient(to bottom, #445F75 0%, #5B7487 100%);
}
.navbar-default .navbar-brand {
    color:#ffffff;
}
.navbar-default .navbar-brand:focus,
.navbar-default .navbar-brand:hover
{
    color:#ffffff;
    background-color:#4298aa;
}
.navbar-default .navbar-nav > li > a {
    color:#ffffff;
}
.navbar-default .navbar-nav > li > a:focus,
.navbar-default .navbar-nav > li > a:hover {
    background-color:#4298aa;
    color:#ffffff;
}
.navbar-default .navbar-nav > .open > a,
.navbar-default > .open > a:focus,
.navbar-default .navbar-nav > .open > a:hover {
    background-color:#4298aa;
    color:#ffffff;
}
.nav .open > a, .nav .open > a:focus, .nav .open > a:hover {
    background-color:#4298aa;
    color:#ffffff;
}
.navbar-default .navbar-nav > .open > a {
    background-color:#4298aa;
    color:#ffffff;
}

1 个答案:

答案 0 :(得分:0)

我发现了这个问题。未正确调用图像文件夹,因此未知箭头情况。感谢FiN和Tejash Desai回答这个问题!