首页 > 解决方案 > b-collapse 和 css 的样式问题

问题描述

我想要做的是修改我的样式,b-collapse因为默认情况下它具有我认为的垂直样式,我想要的是给我的菜单一个水平样式

这就是我实现它的方式:

<div style="background-color:white;">
          <b-collapse id="collapse-cat-lvl1-469">
            <div data-cat-acc="473" class="grid-item parent-lvl-2">
              <a class="link -1 grid-sty-1" href="#" target="_self" data-menu-item-id="473">
                <span class="text">GTI</span>
              </a>
            </div>
            <div data-cat-acc="474" class="grid-item parent-lvl-2">
              <a class="link sty-1 grid-sty-1" href="#" target="_self" data-menu-item-id="474">
                <span class="text">Pets</span>
              </a>
            </div>
         </b-collapse>
        </div>

您可以<b-collapse id = "collapse-cat-lvl1-469">在以下情况下进行修改:collapse-cat-lvl1-469???

我打算用 CSS 给它更好的样式,或者以某种方式让我可以水平而不是垂直地看到我的菜单

    .navbar-greetings, .login-section{display: none}

      #menu-header.collapse:not(.show){
        display: block;
      }

      #menu-header{
        position: fixed;
        top: 25px;
        max-width: 83%;
        margin: 0 auto;
        left: 8.32%;
        .panel{
          button{
            display: block;
            color: white;
            font-size: 13px;
            font-family: 'VWHead-Bold';
          }
        }
        #accordion-mbl-menu{
          display: flex;
        }
      }

标签: cssvue.jsbootstrap-vue

解决方案


推荐阅读