Question

我知道这个问题已被多次询问，我检查了所有可能的解决方案，但没有一个对我有效。

这是我的问题：我正在使用bootstrap 3.2，我创建了一个完美的chrome，firefox和最新的IE浏览器，但不是在IE8,7。我尝试添加以下文件，但它没有帮助：

<!--[if lt IE 9]>
      <script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
      <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
    <![endif]-->

除此之外，我尝试添加：filter: none !important;并删除了.collapse{display:none}但是玩完这些东西之后，我得到的菜单处于垂直位置而不是水平位置。以下是我试过的黑客攻击前后的下拉菜单的两张图片。

IE8 enter image description here

IE11 enter image description here

删除后.collapse {display：none} enter image description here

这是我的代码：

<div class="navbar navbar-inverse">
  <div class="navbar-collapse collapse navbar-responsive-collapse">
    <ul class="nav navbar-nav">
      <li class="active"> <a href="<%=request.getContextPath()%>/modules/home/homePage.jsp"> <span class="glyphicon glyphicon-home"></span> </a> </li>
      <li class="dropdown">
        <a href="#" class="dropdown-toggle" data-toggle="dropdown">Tipologie mandrini</a>
        <ul class="dropdown-menu">
          <li><a href="<%=request.getContextPath()%>/modules/tipologieMandrini/new/viewNewContent.jsp">  <span class="glyphicon glyphicon-pencil"></span> Inserersi nuovo modello</a></li>
          <li><a href="<%=request.getContextPath()%>/modules/tipologieMandrini/ricerca/viewRicerca.jsp"> <span class="glyphicon glyphicon-search"></span> Ricerca</a></li>
          <li><a href="<%=request.getContextPath()%>/modules/tipologieMandrini/view/viewHomeContent.jsp"> <span class="glyphicon glyphicon-list"></span> Visita</a></li>
        </ul>
      </li>
      <li class="dropdown">
        <a href="#" class="dropdown-toggle" data-toggle="dropdown">Singoli mandrini</a>
        <ul class="dropdown-menu">
          <li><a href="<%=request.getContextPath()%>/modules/singoliMandrini/new/viewNewContent.jsp"> <span class="glyphicon glyphicon-pencil"></span> Inserersi nuovo mandrini</a></li>
          <li><a href="<%=request.getContextPath()%>/modules/singoliMandrini/ricerca/viewRicerca.jsp"> <span class="glyphicon glyphicon-search"></span> Ricerca</a></li>
          <li><a href="<%=request.getContextPath()%>/modules/singoliMandrini/view/viewHomeContent.jsp"> <span class="glyphicon glyphicon-list"></span> Visita</a></li>
        </ul>
      </li>
      <li class="dropdown">
        <a href="#" class="dropdown-toggle" data-toggle="dropdown">Macchine</a>
        <ul class="dropdown-menu">
          <li><a href="<%=request.getContextPath()%>/modules/macchine/new/viewNewContent.jsp"> <span class="glyphicon glyphicon-pencil"></span> Inserersi nuovo macchina</a></li>
          <li><a href="<%=request.getContextPath()%>/modules/macchine/ricerca/viewRicerca.jsp"> <span class="glyphicon glyphicon-search"></span> Ricerca</a></li>
          <li><a href="<%=request.getContextPath()%>/modules/macchine/view/viewHomeContent.jsp"> <span class="glyphicon glyphicon-list"></span> Visita</a></li>
        </ul>
      </li>
      <li class="dropdown">
        <a href="#" class="dropdown-toggle" data-toggle="dropdown">Montaggio</a>
        <ul class="dropdown-menu">
          <li><a href="<%=request.getContextPath()%>/modules/montaggio/new/viewNewContent.jsp"> <span class="glyphicon glyphicon-pencil"></span> Inserersi nuovo montaggio</a></li>
          <li><a href="<%=request.getContextPath()%>/modules/montaggio/ricerca/viewRicerca.jsp"> <span class="glyphicon glyphicon-search"></span> Ricerca</a></li>
          <li><a href="<%=request.getContextPath()%>/modules/montaggio/view/viewHomeContent.jsp"> <span class="glyphicon glyphicon-list"></span> Visita</a></li>
        </ul>
      </li>
      <li class="dropdown">
        <a href="#" class="dropdown-toggle" data-toggle="dropdown">Smontaggio</a>
        <ul class="dropdown-menu">
          <li><a href="<%=request.getContextPath()%>/modules/smontaggio/new/viewNewContent.jsp"> <span class="glyphicon glyphicon-pencil"></span> Inserersi nuovo Smontaggio</a></li>
          <li><a href="<%=request.getContextPath()%>/modules/smontaggio/ricerca/viewRicerca.jsp"> <span class="glyphicon glyphicon-search"></span> Ricerca</a></li>
          <li><a href="#"> <span class="glyphicon glyphicon-list"></span> Visita</a></li>
        </ul>
      </li>
      <li class="dropdown">
        <a href="#" class="dropdown-toggle" data-toggle="dropdown">SKF SF riparazione</a>
        <ul class="dropdown-menu">
          <li><a href="<%=request.getContextPath()%>/modules/SKFsfRepair/new/viewNewContent.jsp"> <span class="glyphicon glyphicon-pencil"></span> Inserersi riparazione</a></li>
          <li><a href="#"> <span class="glyphicon glyphicon-search"></span> Ricerca</a></li>
          <li><a href="#"> <span class="glyphicon glyphicon-list"></span> Visita</a></li>
          <li class="dropdown-submenu">
             <a href="#">Ship</a>
             <ul class="dropdown-menu">
               <li><a href="<%=request.getContextPath()%>/modules/SKFsfRepair/ship/new/viewNewContent.jsp">Ship to Cassino</a></li>
             </ul>
          </li>

           <li class="dropdown-submenu">
             <a href="#">Accept</a>
             <ul class="dropdown-menu">
               <li><a href="<%=request.getContextPath()%>/modules/SKFsfRepair/accept/viewAcceptContent.jsp">Accept spindle(s)</a></li>
             </ul>
          </li>

        </ul>
      </li>
      <li class="dropdown">
        <a href="#" class="dropdown-toggle" data-toggle="dropdown">Altro fornitore</a>
        <ul class="dropdown-menu">
          <li><a href="#"> <span class="glyphicon glyphicon-pencil"></span> Inserersi altro fornitore</a></li>
          <li><a href="#"> <span class="glyphicon glyphicon-search"></span> Ricerca</a></li>
          <li><a href="#"> <span class="glyphicon glyphicon-list"></span> Visita</a></li>
        </ul>
      </li>
    </ul>

  </div>
</div>

注意：我使用的是此处提供的YETI主题：http://bootswatch.com/yeti/

Answer 1

我相信这里有一个问题的答案： IE8 issue with Twitter Bootstrap 3 。

似乎respond.js仅适用于本地文件。引用的stackoverflow文章提到在IE8上使用bootstrap.css的本地副本来访问您的网站。希望这会有所帮助。

在IE8中看不到Bootstrap导航栏

1 个答案: