Warning: file_get_contents(/data/phpspider/zhask/data//catemap/4/video/2.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Twitter bootstrap 如何更改引导下拉子菜单图标?_Twitter Bootstrap - Fatal编程技术网

Twitter bootstrap 如何更改引导下拉子菜单图标?

Twitter bootstrap 如何更改引导下拉子菜单图标?,twitter-bootstrap,Twitter Bootstrap,我使用的是bootstrap 2.3.2,我让它的子菜单从左侧站点打开,我将子菜单箭头图标放在左侧,但我不知道如何将右箭头图标更改为左箭头图标 更新 这是包含子项的li标记: <li class="dropdown"> <a href="#" class="dropdown-toggle" data-toggle="dropdown">Parent1 <b class="caret"> </b></a> <

我使用的是bootstrap 2.3.2,我让它的子菜单从左侧站点打开,我将子菜单箭头图标放在左侧,但我不知道如何将右箭头图标更改为左箭头图标

更新

这是包含子项的
li
标记:

<li class="dropdown">
    <a href="#" class="dropdown-toggle" data-toggle="dropdown">Parent1 <b class="caret">
    </b></a>
    <ul class="dropdown-menu">
        <li class="dropdown-submenu"><a href="#" tabindex="-1">Sub-Parent1</a>
            <ul class="dropdown-menu">
                <li><a href="#"><i class="fa fa-plus"></i>&nbsp;Child1</a></li>
                <li><a href="~/User"><i class="fa fa-list"></i>&nbsp;Chiled2</a></li>
                <li class="divider"></li>
                <li><a href="#"><i class="fa fa-plus"></i>&nbsp;Child3</a></li>
                <li><a href="~/User"><i class="fa fa-list"></i>&nbsp;Child4</a></li>
            </ul>
        </li>
        <li class="dropdown-submenu"><a href="#" tabindex="-1">Sub-Parent2</a>
            <ul class="dropdown-menu">
                <li><a href="#"><i class="fa fa-plus"></i>&nbsp;Child1</a></li>
                <li><a href="~/User"><i class="fa fa-list"></i>&nbsp;Child2</a></li>
                <li class="divider"></li>
                <li><a href="#"><i class="fa fa-plus"></i>&nbsp;Child3</a></li>
                <li><a href="~/User"><i class="fa fa-list"></i>&nbsp;Child4</a></li>
            </ul>
        </li>
    </ul>
</li>

  • 我用
    bootstrao.css
    中的设置
    float:left
    让孩子们从左侧站点打开,为了把箭头图标放在左侧,我做了同样的操作,现在我只需要更改图标本身。

    你需要查看名为
    下拉子菜单>a:after的类。这就是引导用来创建箭头的内容。对我来说,这似乎是一种非常可怕的方式,它使用了边界等等

    display: block;
    float: right;
    width: 0;
    height: 0;
    margin-top: 5px;
    margin-right: -10px;
    border-color: transparent;
    border-left-color: #ccc;
    border-style: solid;
    border-width: 5px 0 5px 5px;
    content: " ";
    
    您必须使用此CSS,将其反转,然后将其添加到您自己的
    下拉子菜单a:before

    的CSS中。就是这样:

    .dropdown-submenu > a:after {
      display: block;
      float: left;
      width: 0;
      height: 0;
      margin-top: 5px;
      margin-right: -10px;
      border-color: transparent;
      border-right-color: #cccccc;
      border-style: solid;
      border-width: 5px 5px 5px 0;
      content: " ";
    }
    

    请出示您的密码谢谢您的帮助。我是按照你的建议做的谢谢他们如何设置这些箭头确实令人困惑。我想切换它改变方向,它看起来很混乱。