我想更改小型设备的bootstrap导航栏菜单大小的设置 [英] I want to change the setting for bootstrap navbar menu size for small devices

问题描述

Hello All ....



我现在在html中跟随代码现在当宽度大小为750px或更小时菜单正在改变但是我想要它当它是950px或更低时改变。

Hello All....

I've following code in html now the menu is changing when the width size is 750px or less but I want it to change when it is 950px or less.

<div class="main-navigation animated with-dropdown-buttons" >
                                          <nav class="navbar navbar-default navbar-fixed-top" style="background-color:rgba(57, 66, 69, 0.2); color:#fff; ">
                                                 <div class="container-fluid">
                                                        <!-- Brand and toggle get grouped for better mobile display -->
                                                        <div class="navbar-header">
                                                          <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" 

                                                          data-target="#bs-example-navbar-collapse-1" aria-expanded="false">
                                                            <span class="sr-only">Toggle navigation</span>
                                                            <span class="icon-bar"></span>
                                                            <span class="icon-bar"></span>
                                                            <span class="icon-bar"></span>
                                                          </button>
                                                          <a class="navbar-brand" style="font-family:Comic Sans MS" href="<%#Page.ResolveUrl( "~/default.aspx") %>"><img src="<%=Page.ResolveUrl( "~/Img/logo_light_blue.jpeg") %>" alt="" /></a>
                                                        </div>

                                                       <!-- Collect the nav links, forms, and other content for toggling -->


                                                       <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1" style="padding-removed0px">
                              <ul class="nav navbar-nav navbar-right">
                                <li><a href="<%=Page.ResolveUrl( "~/default.aspx") %>">Home</a></li>
                                <li class="dropdown">
                                  <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Loan</a>
                                  <ul class="dropdown-menu">
                                        <li><a href="<%=Page.ResolveUrl( "~/perloan.aspx") %>">Personel Loans</a></li>
                                        <li><a href="<%=Page.ResolveUrl( "~/homloan.aspx") %>">Home Loans</a></li>

 <li><a href="<%=Page.ResolveUrl( "~/lap.aspx") %>">Loan Against Property</a></li>
                                        <li><a href="<%=Page.ResolveUrl( "~/autloan.aspx") %>">Vehicle Loans</a></li>
                                        <li><a href="<%=Page.ResolveUrl( "~/edu.aspx") %>">Education Loans</a></li>
                                        <li><a href="<%=Page.ResolveUrl( "~/buss.aspx") %>">Business Loans</a></li>
                                        <li><a href="<%=Page.ResolveUrl( "~/expert.aspx") %>">Expert Advice</a></li>
                                  </ul>
                                </li>


                            <li><a href="policy.aspx">Policy</a></li>
                            <li><a href="<%=Page.ResolveUrl( "~/cards/card.aspx") %>">Cards</a></li>

                                <li class="dropdown">   
                                 <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">FD / RD</a>
                                  <ul class="dropdown-menu">
                                        <li><a href="<%=Page.ResolveUrl( "~/fd.aspx") %>">Fixed Deposit</a></li>
                                        <li><a href="<%=Page.ResolveUrl( "~/rd.aspx") %>">Recurring Deposit</a></li>
                                  </ul>
                                </li>

                                <li class="dropdown">
                                <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Account</a>
                                   <ul class="dropdown-menu">
                                                                  <li><a href="<%=Page.ResolveUrl( "~/saving.aspx") %>">Savings Account</a></li>
                                                                <li><a href="<%=Page.ResolveUrl( "~/current.aspx") %>">Current Account</a></li>
                                                                <li><a href="ppf.aspx">PPF Account</a></li>
                                                                <li><a href="demat.aspx">Demat Account</a></li>
                                    </ul>
                                </li>
                                                        <li><a href="tax.aspx">Taxes</a></li>
                                                        <li><a href="<%=Page.ResolveUrl( "~/contact.aspx") %>">Contact Us</a></li>
     
     
                           <%-- <div class="navbar-form navbar-left pull-right" style="margin:0px">
                                <div class="form-group" style="padding-removed0px; float:right">
                                  
                                  <input type="text" class="form-control" id="q" name="q" />

                                <button type="submit" class="btn btn-danger" value="Search" > </button>
                                </div>
                              </div>--%>
             </ul>
        
    </div>                                  <!-- /.navbar-collapse -->
                                                      </div><!-- /.container-fluid -->
                                          </nav>
                                      </div>

推荐答案

If you want to change the Bootstrap media query breakpoints, there’s a tool for that[^].

If you want to change the Bootstrap media query breakpoints, there's a tool for that[^].

这篇关于我想更改小型设备的bootstrap导航栏菜单大小的设置的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！