Question

我在shopify中设计了一个网页并尝试使用bootstrap导航栏，但导航栏右侧没有正确折叠，右侧导航栏应该在主菜单下折叠，但它出现在主菜单的右侧

这是我的代码

<nav class="navbar navbar-default">
  <div class="container-fluid">
    <div class="navbar-header">
      <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#myNavbar">
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>                        
      </button>
      <a class="navbar-brand" href="/">Shancha</a>
    </div>
<div class="collapse navbar-collapse" id="myNavbar">
  <ul class="nav navbar-nav navbar-left en-nav-li">
    <li><a href="/pages/en-home">HOME</a></li>
    <li><a href="/pages/en-story">OUR STORY</a></li>
    <li><a href="/pages/en-product">PRODUCTS</a></li>
    <li><a href="/pages/en-beauty">BEAUTY OF CAMELLIA</a></li>
    <li><a href="/pages/en-membership">MEMBERSHIP</a></li>
    <li><a href="/pages/en-explore">EXPLORER</a></li>
    <li><a href="/pages/en-healthy-recipes">HEALTHY RECIPES</a></li>
    <li><a href="/pages/en-contact">CONTACT US</a></li>
  </ul>
  <ul class="nav navbar-nav navbar-right">
    <li>
        {% if shop.customer_accounts_enabled %}
            {% if customer %}
                <a href="/account"><span class="glyphicon glyphicon-user"></span></a>
            {% else %}
                <a href="/account/login"><span class="glyphicon glyphicon-user"></span></a>
            {% endif %}
        {% endif %}     
    </li>
    <li>
        <a href="/cart" >
        {% include 'icon-cart' %}
        <span class="visually-hidden">{{ 'layout.cart.title' | t }}</span>
        <span class="icon__fallback-text">{{ 'layout.cart.title' | t }}</span>
          {% if cart.item_count > 0 %}
          <div id="CartCount" class="site-header__cart-count">
            <span>{{ cart.item_count }}</span>
            <span class="icon__fallback-text medium-up--hide">{{ 'layout.cart.items_count' | t: count: cart.item_count }}</span>
          </div>
        {% endif %}
        </a>

    </li>
  </ul>
</div>

shopify bootstrap 3 navbar-right崩溃问题

0 个答案: