一点小小的创意css鼠标放上去则显示电话号码


            1， default: 



2，鼠标移上去:来源： 今天在同事的手机的电话薄里面发现的，发现他存的电话号码都是显示名字，然后只要往下移动，就能显示这个人的相应的号码。       然后自己就在想，这还满不错的嘛。于是就想到以前好象收藏过类似的效果。 稍微改下。      总结：生活中的发现无处不在，能够善于发现，然后勤于思考、联想，这样的确是个优点
。  
  
  
comasp's blog  
  
a{  
    color: #FFFF99;  
    text-decoration: none;  
}a:hover{  
    color: #FFFFFF;  
    text-decoration: underline;  
}  
     
#nav{  
    padding: 10px 10px 0;  
    font-size: 12px;  
    font-weight: bold;  
    margin: 1em 0 0;  
    list-style:none;  
}.bi{  
    position: relative;  
    z-index: 0;  
}.bi:hover{  
    z-index: 99;  
}.bi:hover span{  
    visibility: visible;  
    top: 0;  
    left: 0;  
    cursor: pointer;  
}.bi span{  
    position: absolute;  
    left: -999em;  
    visibility: hidden;  
}#nav li a,.bi:hover span{  
    line-height: 20px;  
    text-decoration: none;  
    background: #DDDDDD;  
    color: #666666;  
    display: block;  
    width: 80px;  
    text-align: center;  
}#nav li a:hover,.bi:hover span{  
    color: #FFFFFF;  
    background: #DC4E1B;  
}.bi:hover span{  
    padding-top: 2px;  
}  
  
  
  
      
      张三13011111111  
      李四13022222222  
      王五13033333333  
      赵六13044444444  
      什么七去了13055555555  
      
  

  [Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]