Twitter Bootstrap 3中的導航欄圖標位置

Question

目前正在為一個項目的頁面工作，當屏幕針對移動設備進行調整時，我有用於折疊導航欄的代碼。 一切都按應有的方式工作，我唯一的問題是圖標欄的位置。 通常，折疊時，圖標欄位於頁面的右上角，但也可以將其放在左側。 我四處搜尋，可以找到許多有關更改圖標圖像，導航欄在何時折疊等的信息，但是將其移至屏幕的另一側卻無濟於事。

這只是具有折疊功能的基本導航欄代碼，但我需要左側的圖標而不是右側的圖標。

<!DOCTYPE html>
<html>
  <head>
    <title>Bootstrap 101 Template</title>


    <link type="text/css" href="css/bootstrap.min.css" rel="stylesheet">
    <link type="text/css" href="css/style.css" rel="stylesheet">
    <link href="http://netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.css" rel="stylesheet">
  </head>

  <body>

    <div class="navbar navbar-default navbar-fixed-top">
        <div class="container">
            <div class="navbar-header">
                <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                </button>
                <a href="#" class="navbar-brand">Practice</a>
            </div>

            <div class="navbar-collapse collapse">
                <ul class="nav navbar-nav">
                    <li><a href="index.html">Home</a></li>
                    <li><a href="about.html">About</a></li>
                    <li><a href="feature.html">Feature</a></li>
                    <li class="dropdown">
                    <a href="tutorials" class="dropdown-toggle" data-toggle="dropdown">Tutorials<b class="caret"></b></a>
                    <ul class="dropdown-menu">
                        <li><a href="#">Bootstrap Tutorials</a></li>
                        <li><a href="#">PHP Tutorials</a></li>
                        <li><a href="#">Java Tutorials</a></li>
                        <li><a href="#">CSS Tutorials</a></li>
                    </ul>
                    </li>
                    <li><a href="contact.html">Contact</a></li>
                </ul>
            </div>

        </div>
    </div>

Answer 1

只需一點CSS就能做到：

.navbar-toggle {
    float: left;
    margin-left: 15px;
}

例

Twitter Bootstrap 3中的導航欄圖標位置

問題描述

1 個解決方案

解決方案1
0 2014-02-13 22:46:42

Twitter Bootstrap 3中的導航欄圖標位置

問題描述

1 個解決方案

解決方案1 0 2014-02-13 22:46:42

解決方案1
0 2014-02-13 22:46:42