【问题标题】:Placing chevron to the right - Navlist将雪佛龙置于右侧 - Navlist
【发布时间】:2023-03-28 00:26:01
【问题描述】:

您好,我正在尝试实现可以​​在http://twitter.github.io/bootstrap/components.html#navs 找到的导航列表,我查看了源代码并尝试使用他们的代码和我自己的代码:

        <div class="span3 bs-docs-sidebar">
        <ul class="nav nav-tabs nav-stacked bs-docs-sidenav span8">
            <li><a href="#Variabler"><b>Variabler</b><i class="icon-chevron-right"></i></a></li>
            <li><a href="#Datatyper"><b>Datatyper</b><i class="icon-chevron-right"></i></a></li>
            <li><a href="#Funktioner"><b>Metoder</b><i class="icon-chevron-right"></i></a></li>
            <li><a href="#"><b>Arrays</b><i class="icon-chevron-right"></i></a></li>
            <li><a href="#"><b>Klasser</b><i class="icon-chevron-right"></i></a></li>
            <li><a href="#variables"><b>HTML5</b><i class="icon-chevron-right"></i></a></li>
            <li><a href="#variables"><b>CSS3</b><i class="icon-chevron-right"></i></a></li>
            <li><a href="#variables"><b>jQuery</b><i class="icon-chevron-right"></i></a></li>
            <li><a href="#variables"><b>AJAX</b><i class="icon-chevron-right"></i></a></li>
            <li><a href="#variables"><b>PHP</b><i class="icon-chevron-right"></i></a></li>
            <li><a href="#variables"><b>MySQL</b><i class="icon-chevron-right"></i></a></li>
            <li><a href="#variables"><b>Twitter Bootstrap</b><i class="icon-chevron-right"></i></a></li>
        </ul>
    </div>

我得到的结果是这样的:

如何将人字形放置在右侧?尝试使用偏移量进行支付,但根据字符串的长度,人字形的位置会有所不同。

【问题讨论】:

    标签: twitter-bootstrap glyphicons twitter-bootstrap-2


    【解决方案1】:

    您可以在图标中添加“pull-right”类:

    <ul class="nav nav-tabs nav-stacked bs-docs-sidenav span8">
      <li><a href="#Variabler"><b>Variabler</b><i class="icon-chevron-right pull-right"></i></a></li>
      <li><a href="#Datatyper"><b>Datatyper</b><i class="icon-chevron-right pull-right"></i></a></li>
      <li><a href="#Funktioner"><b>Metoder</b><i class="icon-chevron-right pull-right"></i></a></li>
      ...
    </ul>
    

    演示:http://www.bootply.com/66221

    【讨论】:

      猜你喜欢
      • 2014-10-08
      • 1970-01-01
      • 2019-10-30
      • 2012-12-27
      • 2021-11-23
      • 2014-08-05
      • 2021-08-10
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多