Question

仪表板的子菜单侧栏问题。

Developed side bar Screen：此后分析子菜单行即将到来。

HTML：

<div class="panel">
     <div class="panel-heading" role="tab" id="headingOne" style="">

        <a role="button" data-toggle="collapse" data-parent="#accordionMenu" href="#collapseOne" aria-expanded="true" aria-controls="collapseOne" class="menuList" 
        style="">
        <img src="../dist/images/Dashboard/salesLead@1x.png" alt="" style="padding: 15px;">
                        Dashoboard
        </a>

      </div>
      <div id="collapseOne" class="panel-collapse collapse in" role="tabpanel" aria-labelledby="headingOne">
        <div class="panel-body">
          <ul class="nav">

            <li class="subMenuList" style="display: inline-flex;">
                <span style="color: #ccc">---</span><a href="#" style="padding-left: 17px">SMS Dashboard</a>
            </li>
           <li class="subMenuList" style="display: inline-flex;line-height: 30px">
                <span style="color: #ccc;bottom: 0px">---</span><a href="#" style="padding-left: 17px; color: #999">Analytics</a>
            </li>
          </ul>
        </div>
      </div>
    </div>

CSS ：

.menuList{
    color: #FFFFFF;
    font-family: 'Open Sans';
    font-size: 13px;
    font-weight: bold;
    line-height: 40px;
}
.menuList:hover,
.menuList:focus {
    text-decoration: none;
    color: white;
}

.subMenuList{
    color: #E40000; 
    font-family: 'Open Sans';   
    font-size: 12px;    
    font-weight: 600;   
    line-height: 40px; 
    border-left: 2px solid #ccc;
}
.subMenuList> a {
    color: #E40000;
    padding-top: 0px !important; 
    padding-bottom: 0px !important;
}
.subMenuList> a:hover  {
    background-color: transparent !important;
}

它应该在Analytics中以设计附件结束。请检查附件

左侧菜单和子菜单

0 个答案: