Put anchor into li : List menu « CSS Controls « HTML / CSS






Put anchor into li

  

<html xmlns="http://www.w3.org/1999/xhtml">
  <head>
    <title></title>
    <style type="text/css">
    body {
      margin: 15%;
    }

    a:link {
    color: #777;
    text-decoration: none;
    }

    a:visited {
      color: #333;
      text-decoration: none;

    }

  a:hover, a:hover  {
    color: #777;
    background-color: #ccc;
  }

  a:active, a:active {
    color: #ccc;
    background-color: #ccc;
  }
    </style>
  </head>
  <body>

  <div id="navsite">

  <p>Link navigation:</p>

  <ul>
   <li><a href="http://www.java2s.com">Link</a></li>
   <li><a href="http://www.java2s.com">Link</a></li>
   <li><a href="http://www.java2s.com">Link</a></li>
    <li><a href="http://www.java2s.com">Link</a></li>
   <li><a href="http://www.java2s.com">Link</a></li>
   <li><a href="http://www.java2s.com">Link</a></li>
  </ul>
  </div>

  <hr />
  <div id="content">
     <h2><a name="europan">Anchor</a></h2>
     <p> <a href="http://www.java2s.com">Link</a> and <a href="http://www.java2s.com">Another link</a></p>
  </div>
  </body>
 </html>

   
  








Related examples in the same category

1.Unordered list containing hyperlinks
2.Horizontal list menu
3.Navigational list
4.Expandable left list based menu
5.List based menu
6.Left list menu and three columns
7.Using image to create non-horizontal links
8.Vertical links