我的響應式導航欄在手機上不起作用

我已經創建了一個響應式菜單，其引導程序爲3，因此它在桌面上工作，但它在手機上不起作用。我的響應式導航欄在手機上不起作用

這是我的桌面全屏代碼

<div class="row"> 
      <div class="navbar navbar-inveren navbar-fixed-top" style="background-color: rgb(192, 12, 26) !important;"> 
       <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> 
         <span class="icon-bar"></span> 
         <span class="icon-bar"></span> 
        </button> 
       </div> 
       <div class="navbar-collapse collapse pull-right"> 
        <ul class="nav navbar-nav navbar-right"> 
         <li class="top_menu"><a style="color: whitesmoke; font-family: 'myfont';" href="/Pages/Contact.aspx">تماس با ما</a></li> 
         <li class="top_menu"><a style="color: whitesmoke; font-family: 'myfont';" href="/Pages/Items.aspx">شرایط و راهنما</a></li> 
         <li class="top_menu"><a style="color: whitesmoke; font-family: 'myfont';" href="/Pages/About.aspx">درباره ما</a></li> 
         <li class="top_menu"><a style="color: whitesmoke; font-family: 'myfont';" href="/login/Login.aspx">ورود به حساب کاربری</a></li> 
         <li class="top_menu"><a style="color: whitesmoke; font-family: 'myfont';" href="/Pages/MySangyar.aspx">سنگیار من</a></li> 
         <li class="top_menu"><a style="color: whitesmoke; font-family: 'myfont';" href="../default.aspx">صفحه نخست</a></li> 
         <li class="top_menu"> 
          <a title="خروج از پنل کاربری" class="navbar-brand" href="/Default.aspx"> 
           <img style="width: 60px; height: 40px;" class="img-responsive img-circle" src="/Images/logo.png" alt="عکسی وجود ندارد" /> 
          </a> 
         </li> 
        </ul> 
       </div> 
      </div> 
     </div>

： enter image description here

，並在桌面上時，它在700像素的大小： enter image description here

，當我加載在Galaxy S5上，它像第一張照片一樣加載，而我想像第二張圖片那樣顯示。

請幫我...

感謝這麼多

來源

2017-07-30 Abuzar

是否更改CSS？如果沒有，檢查來自Shahidul的答案，因爲也許你忘了添加這個元視口...這是不相關的，但沒有你想要「navbar-inverse」類，你有「navbar-inveren」 – Wordica

添加此meta標籤內head標記你的代碼：

<meta name="viewport" content="width=device-width, initial-scale=1.0">

來源

2017-07-30 13:48:41

非常感謝我的問題已解決 – Abuzar

我的響應式導航欄在手機上不起作用

回答

相關問題