首页>>导航菜单>>响应式自适应多级CSS3下拉菜单导航(2017-06-27)

响应式自适应多级CSS3下拉菜单导航

响应式自适应多级CSS3下拉菜单导航

 

XML/HTML Code
  1. <div class="content">  
  2.     <ul class="venus-menu">  
  3.         <li class="active"><a href="#"><i class="icon-home"></i>Home</a></li>  
  4.         <li><a href="#"><i class="icon-magic"></i>About</a></li>  
  5.         <li>  
  6.             <a href="#"><i class="icon-thumbs-up"></i>Services</a>  
  7.             <ul>  
  8.                 <li><a href="#">Web Design</a></li>  
  9.                 <li><a href="#">Hosting</a></li>  
  10.                 <li>  
  11.                     <a href="#">Design</a>  
  12.                     <ul>  
  13.                         <li><a href="#">Graphics</a></li>  
  14.                         <li><a href="#">Vectors</a></li>  
  15.                         <li>  
  16.                             <a href="#">Photoshop</a>  
  17.                             <ul>  
  18.                                 <li><a href="#">Photo editing</a></li>  
  19.                                 <li><a href="#">Business cards</a></li>  
  20.                                 <li><a href="#">Websites</a></li>  
  21.                                 <li><a href="#">Flyers</a></li>  
  22.                             </ul>  
  23.                         </li>  
  24.                         <li><a href="#">Fonts</a></li>  
  25.                     </ul>  
  26.                 </li>  
  27.                 <li><a href="#">Consulting</a></li>  
  28.             </ul>  
  29.         </li>  
  30.         <li><a href="#"><i class="icon-envelope-alt"></i>Contact</a></li>  
  31.         <li class="search">  
  32.             <form method="get">  
  33.                 <input type="text" name="search" class="search" placeholder="www.freejs.net" />  
  34.             </form>  
  35.         </li>  
  36.     </ul>  
  37. </div>  

 


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