css+div 菜单

<style>#menu {
  width:8em;
  padding:0.5em;
  background:#ccc;
  margin:0 auto;
  }
#menu a, #menu a:visited {
  display:block;
  width:7em;
  padding:0.25em 0;
  color:#000;
  text-indent:0.2em;
  background-color:#fff;
  text-decoration:none;
  margin:0.5em 0;
  border-left:0.5em solid #9ab;
  }
#menu a:visited span {
  display:block;
  position:absolute;
  top:0;
  left:10em;
  width:5em;
  font-size:0.9em;
  color:#c00;
  border:1px solid #c00;
  }
#menu a span {
  display:none;
  }
#menu a:hover {
  color:#f00;
  border-left:0.5em solid #000;
  }
.box {
  position:relative;
  }
</style>
<div id="menu">
  <div class="box">
    <a href="menuone.html">
      menu one
      <span>
        VISITED
      </span>
    </a>
  </div>
  <div class="box">
    <a href="menutwo.html">
      menu two
      <span>
        VISITED
      </span>
    </a>
  </div>
  <div class="box">
    <a href="menuthree.html">
      menu three
      <span>
        VISITED
      </span>
    </a>
  </div>
  <div class="box">
    <a href="menufour.html">
      menu four
      <span>
        VISITED
      </span>
    </a>
  </div>
  <div class="box">
    <a href="menufive.html">
      menu five
      <span>
        VISITED
      </span>
    </a>
  </div>
</div>