默认情况下如何调整导航标签以调整移动设备分辨率?

时间:2014-01-27 08:42:34

标签: css twitter-bootstrap mobile

我有一个使用twitter bootstrap 3开发的导航标签,但默认情况下它没有调整到移动分辨率。如何使用课程进行调整?

代码:

<div class="row clearfix">
    <div class="col-md-12 column">
        <div class="tabbable" id="tabs-85910">
            <ul class="nav nav-tabs">
                <li class="active">
                    <a href="#panel-421853" data-toggle="tab">Home</a>
                </li>
                <li>
                    <a href="#panel-277629" data-toggle="tab">Personal Details</a>
                </li>
                <li>
                    <a href="#panel-277620" data-toggle="tab">Product Details</a>
                </li>
            </ul>
            <div class="tab-content">
                <div class="tab-pane active" id="panel-421853">
                    <p>
                        I'm in Section 1.
                    </p>
                </div>
                <div class="tab-pane" id="panel-277629">
                    <p>
                        Howdy, I'm in Section 2.
                    </p>
                </div>
                <div class="tab-pane" id="panel-277620">
                    <p>
                        Howdy, I'm in Section 3.
                    </p>
                </div>
            </div>
        </div>
    </div>
</div>

附加问题的屏幕截图。

enter image description here

1 个答案:

答案 0 :(得分:0)

添加此html: -

<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".tabbable">
    <span class="sr-only">Toggle navigation</span>
    <span class="icon-bar"></span>
    <span class="icon-bar"></span>
    <span class="icon-bar"></span>
    </button>

<ul class="nav nav-tabs" class="collapse">