首页>>导航菜单>>左侧固定侧边栏导航(2020-08-28)

左侧固定侧边栏导航

固定宽度，移动端不适用，本站有其他折叠的代码，例如Jquery侧边栏固定折叠导航

左侧固定侧边栏导航
演示
下载
赞赏支持
立刻微信赞赏支持 关闭

 

XML/HTML Code
  1. <div id="contentLeft">  
  2.   
  3.             <ul id="leftNavigation">  
  4.   
  5.                 <li class="active">  
  6.                     <a href="#"><i class="fa fa-coffee leftNavIcon"></i> About us</a>  
  7.                     <ul>  
  8.                         <li>  
  9.                             <a href="#"><i class="fa fa-angle-right leftNavIcon"></i> Our History</a>  
  10.                         </li>  
  11.                         <li>  
  12.                             <a href="#"><i class="fa fa-angle-right leftNavIcon"></i> Our Team</a>  
  13.                         </li>  
  14.                     </ul>  
  15.                 </li>  
  16.                 <li>  
  17.                     <a href="#"><i class="fa fa-flask leftNavIcon"></i> Products</a>  
  18.                     <ul>  
  19.                         <li>  
  20.                             <a href="#"><i class="fa fa-angle-right leftNavIcon"></i> Garden</a>  
  21.                         </li>  
  22.                         <li>  
  23.                             <a href="#"><i class="fa fa-angle-right leftNavIcon"></i> Office</a>  
  24.                         </li>  
  25.                         <li>  
  26.                             <a href="#"><i class="fa fa-angle-right leftNavIcon"></i> Home</a>  
  27.                         </li>  
  28.                     </ul>  
  29.                 </li>  
  30.                 <li>  
  31.                     <a href="#"><i class="fa fa-truck leftNavIcon"></i> Services</a>  
  32.                     <ul>  
  33.                         <li>  
  34.                             <a href="#"><i class="fa fa-angle-right leftNavIcon"></i> Garden</a>  
  35.                         </li>  
  36.                         <li>  
  37.                             <a href="#"><i class="fa fa-angle-right leftNavIcon"></i> Office</a>  
  38.                         </li>  
  39.                         <li>  
  40.                             <a href="#"><i class="fa fa-angle-right leftNavIcon"></i> Home</a>  
  41.                         </li>  
  42.                     </ul>  
  43.                 </li>  
  44.                 <li class="clickable">  
  45.                     <a href="#"><i class="fa fa-envelope-o leftNavIcon"></i> Contact us</a>  
  46.                 </li>  
  47.   
  48.             </ul>  
  49.   
  50.         </div>  

 


原文地址:http://www.freejs.net/article_daohangcaidan_885.html