左上角缺部分的菜单
<title>无标题文档</title>
<style>
.item{
font-family:Arial, Helvetica, sans-serif;
font-size:16px;
background:#ccc;
list-style-type:none;
float:left;
padding-bottom:5px;
}
.item li{
float:left;
padding:5px;
margin:5px;
}
.item li a,.item li a:visited{
color:#fff;
text-decoration:none;
font-weight:bold;
position:relative;
background-color:red;
padding:5px;
}
.item li a span{
width:0px;
height:0px;
border-width:8px 8px 0 0;
border-color:#ccc #f00;
border-style:solid;
overflow:hidden;
display:block;
position:absolute;
top:0px;
left:0px;
}
.item li a:hover span{
border-color:#ccc #c90;}
.item li a:hover{
color:#000;
background:#c90;}
</style>
</head>
<body>
<ul class="item">
<li><a href="#"><span></span>Home</a></li>
<li><a href="#"><span></span>Contact Us</a></li>
<li><a href="#"><span></span>Web Dev</a></li>
<li><a href="#"><span></span>Web Design</a></li>
<li><a href="#"><span></span>Map</a></li>
</ul>
</body>
