2

ドロップダウン付きのブートストラップレスポンシブナビゲーションを使用しています。サイトが小さな画面に表示されている場合、ドロップダウンを無効にして、ドロップダウン切り替えボタンの背後にあるハイパーリンクを有効にしたいと考えています。

すでに無効化されたクラスをトグル ボタンに追加しましたが、@media(max-width:480px) の場合にのみ機能させるにはどうすればよいですか?

テストページはこちら

<div class="row nav_row mobile">
        <ul class="nav nav-pills dropdown nav_responsive">
            <li><a class="dropdown-toggle collapse-btn">Menu<span class="caret"></span></a></li>
        </ul>
        <div class="nav-collapse">
            <ul class="nav nav-pills">
                <li class="dropdown"> <a class="dropdown-toggle" data-toggle="dropdown" href="#">Vakanties <b class="caret"></b></a>
                    <ul class="dropdown-menu">
                        <li><a href="#">Binnenland</a></li>
                        <li><a href="#">Buitenland</a></li>
                        <li><a href="#">Inleefreizen</a></li>
                        <li><a href="#">Gezondheidsreizen</a></li>
                    </ul>
                </li>
                <li class="dropdown"> <a class="dropdown-toggle" data-toggle="dropdown" href="#">Vormingen <b class="caret"></b></a>
                    <ul class="dropdown-menu">
                        <li><a href="#">Monitor</a></li>
                        <li><a href="#">Hoofdmonitor</a></li>
                        <li><a href="#">Instructeur</a></li>
                    </ul>
                </li>
                <li><a href="#">Gezondheid</a></li>
                <li class="dropdown"> <a class="dropdown-toggle" data-toggle="dropdown" href="#">Internationaal <b class="caret"></b></a>
                    <ul class="dropdown-menu">
                        <li><a href="#">EVS</a></li>
                        <li><a href="#">Groepsuitwisselingen</a></li>
                        <li><a href="#">Trainingscursussen</a></li>
                    </ul>
                </li>
                <li><a href="#">Projecten</a></li>
                <li class="clearfix"><a href="#">Actueel</a></li>
            </ul>
            <div style="clear:left"></div>
        </div>
    </div>
4

3 に答える 3

0 
.dropdown-menu {
    border: 0 none;
    display: block;
    float: none;
    font-size: 14px;
    padding: 5px 19px;
    position: static;
    text-align: none;
}
于 2016-01-23T08:16:34.670 に答える