Wednesday, October 26, 2016

The Nav Tag

The <nav> tag is one of the most useful and essential tags in web design, considering how it's what creates the menu bar.
Ex. <nav class="w3-sidenav w3-light-grey w3-card-2" style="width:70px;"></nav>, accompanied by <div>s and <a href>s inside, creating links leading to other parts of the site.

Ex. from my own code:
<nav class="w3-sidenav w3-light-grey w3-card-2" style="width:70px;">
    <div class="w3-accordion","tooltip">
      <a onclick="myAccFunc()" href="#"><i class="fa fa-bars w3-xxlarge"></i></a>
      <div id="demoAcc" class="w3-accordion-content w3-white w3-card-4">
        <div class="tooltip">
        <a href="#"><i class="fa fa-bell w3-xxlarge"></i></a>
        <span class="tooltiptext">Notifications</span>
      </div>
        <a href="#"><i class="fa fa-calendar w3-xxlarge"></i></a>
        <a href="#"><i class="fa fa-globe w3-xxlarge"></i></a>
        <a href="#"><i class="fa fa-book w3-xxlarge"></i></a>
           <div class="w3-dropdown-click">
             <a onclick="myDropFunc()" href="#"><i class="fa fa-gamepad w3-xxlarge"></i></a>
             <div id="demoDrop" class="w3-dropdown-content w3-white w3-card-4">
               <a href="#"><i class="fa fa-map-marker w3-xxlarge"></i></a>
               <a href="#"><i class="fa fa-trophy w3-xxlarge"></i></a>
               <a href="#"><i class="fa fa-dot-circle-o w3-xxlarge"></i></a>
              </div>
             </div>
           </div>
         </div>
       </div>
</nav>


No comments:

Post a Comment

Note: Only a member of this blog may post a comment.

Cesarini_Final

I hope you have a great Holiday break!!! EmCesarini.github.io Website Direct Link