Laravel侧边栏模板

时间:2017-10-31 01:54:36

标签: php laravel sidebar

我想为我的网页制作一个侧边栏,但是我在做这件事时遇到了一些麻烦,我按照了很多教程,然后侧边栏没有出来而只是单词出来了。我看到的大多数人只使用php,但我觉得有必要使用javascript。有人可以给我一个关于在屏幕截图中制作这样的侧边栏的模板。

enter image description here

这是我使用的代码: sidebar.blade.php

 <div class="app-body">
    <div class="sidebar">
      <nav class="sidebar-nav">
        <ul class="nav">
          <li class="nav-item">
            <a class="nav-link" href="main.html"><i class="icon-speedometer"></i> Dashboard <span class="badge badge-primary">NEW</span></a>
          </li>

          <li class="nav-title">
            UI Elements
          </li>
          <li class="nav-item nav-dropdown">
            <a class="nav-link nav-dropdown-toggle" href="#"><i class="icon-puzzle"></i> Components</a>
            <ul class="nav-dropdown-items">
              <li class="nav-item">
                <a class="nav-link" href="components/buttons.html"><i class="icon-puzzle"></i> Buttons</a>
              </li>
              <li class="nav-item">
                <a class="nav-link" href="components/social-buttons.html"><i class="icon-puzzle"></i> Social Buttons</a>
              </li>

            </ul>
          </li>
          <li class="nav-item nav-dropdown">
            <a class="nav-link nav-dropdown-toggle" href="#"><i class="icon-star"></i> Icons</a>
            <ul class="nav-dropdown-items">
              <li class="nav-item">
                <a class="nav-link" href="icons/font-awesome.html"><i class="icon-star"></i> Font Awesome <span class="badge badge-secondary">4.7</span></a>
              </li>

            </ul>
          </li>
          <li class="nav-item">
            <a class="nav-link" href="widgets.html"><i class="icon-calculator"></i> Widgets <span class="badge badge-primary">NEW</span></a>
          </li>

            Extras
          </li>
          <li class="nav-item nav-dropdown">
            <a class="nav-link nav-dropdown-toggle" href="#"><i class="icon-star"></i> Pages</a>
            <ul class="nav-dropdown-items">
              <li class="nav-item">
                <a class="nav-link" href="views/pages/login.html" target="_top"><i class="icon-star"></i> Login</a>
              </li>
              <li class="nav-item">
                <a class="nav-link" href="views/pages/register.html" target="_top"><i class="icon-star"></i> Register</a>
              </li>
            </ul>
          </li>
        </ul>
      </nav>
      <button class="sidebar-minimizer brand-minimizer" type="button"></button>
    </div>

这就是我得到的: enter image description here

1 个答案:

答案 0 :(得分:2)