（仿腾讯QQ秀首页）关于A伪类开发笔记
屁话少说，（ps：最近感觉自己有点唐僧）看代码先：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<head>
<title>a</title>
<style type="text/css">
html.body{text-align:left;}
ol,ul,img{border:0;float:left;margin:0;padding:0;list-style: none;}
cite,u,em,i{font-style:normal;text-decoration:none;}
ul#hovershow2{list-style: none;margin: 50px;width:750px;float: left;display: inline;clear: both;border:1px solid #ccc;height:200px;text-align:left;position:relative;*position:static;overflow:hidden;}
ul#hovershow2 li{float: left;display: inline;width:84px;height: 84px;margin:5px 30px;border:1px solid #ccc;*overflow:hidden;}
ul#hovershow2 li a {text-decoration: none;display: block;*display:inline; width:84px;height:84px;line-height: 20px;font-size: 12px;text-align: center;}
ul#hovershow2 li img{ position:absolute;z-index:100}
ul#hovershow2 li span,ul#hovershow2 li cite{display:none;_visibility:hidden;position: absolute;width:190px;height: 140px;margin: -5px;padding:5px;text-align:left;filter:alpha(opacity=80);-moz-opacity:.8;opacity:.8;background:#fff;z-index:101;border:1px red solid;overflow:hidden;}
ul#hovershow2 li cite{margin-left:-110px;}
ul#hovershow2 li cite img{right:5px;}
ul#hovershow2 em,ul#hovershow2 i,ul#hovershow2 u{width:100px;clear:both;height:20px;line-height:20px;margin:0;float:right;padding:0;display:block;}
ul#hovershow2 li a:hover{_filter:alpha(opacity=100);background:transparent}
ul#hovershow2 li a:hover .none{display:none;}
ul#hovershow2 li a:hover img{position:absolute;z-index:102}
ul#hovershow2 li a:hover span,ul#hovershow2 li a:hover cite{display:block; _visibility:visible;_position:absolute;_z-index:105;}/*for IE6*/
ul#hovershow2 li cite em,ul#hovershow2 li cite i,ul#hovershow2 li cite u{float:none;}
ul#hovershow2 li cite div{}
.bbnr{margin-left:-110px;*margin:0;z-index:102;display:none;padding-left:5px;*padding:0;top:105px;position:relative;}/*注意顺序FF*/
.bbn{width:190px;clear:both;position:absolute;bottom:5px;text-align:left;height:40px;overflow:hidden;}
ul#hovershow2 li a:hover .bbnr{display:block;}
.bbn inc{color:#f60;clear:both;}
.bbn button{float:left;width:40px;height:18px;line-height:18px;border:1px solid #f60;margin:1px;font-size:12px; text-align:center;padding:0;cursor:pointer}
</style>
</head>
<body>
<ul id="hovershow2">
<li><a href="#" title="test"><img src="images/show2.gif" class="none"/><div class="bbn"><inc>免费试穿</inc><button>购买</button><button>赠送</button><button>索要</button><button>收藏</button></div><span><img src="images/show2.gif" /><em>花样年华</em><i> 4.5习币</i><u>点击图片换装</u><div class="bbn"><inc>免费试穿</inc><button>购买</button><button>赠送</button><button>索要</button><button>收藏</button></div></span></a></li>
<li><a href="#" title="test"><img src="images/show2.gif" class="none"/><span><img src="images/show2.gif" /><em>花样年华</em><i> 4.5习币</i><u>点击图片换装</u><div class="bbn"><inc>免费试穿</inc><button>购买</button><button>赠送</button><button>索要</button><button>收藏</button></div></span></a></li>
<li><a href="#" title="test"><img src="images/show2.gif" class="none"/><span><img src="images/show2.gif" /><em>花样年华</em><i> 4.5习币</i><u>点击图片换装</u><div class="bbn"><inc>免费试穿</inc><button>购买</button><button>赠送</button><button>索要</button><button>收藏</button></div></span></a></li>
<li><a href="#" title="test"><img src="images/show2.gif" class="none"/><span><img src="images/show2.gif" /><em>花样年华</em><i> 4.5习币</i><u>点击图片换装</u><div class="bbn"><inc>免费试穿</inc><button>购买</button><button>赠送</button><button>索要</button><button>收藏</button></div></span></a></li>
<li><a href="#" title="test"><img src="images/show2.gif" class="none"/><cite><img src="images/show2.gif" /><em>花样年华</em><i> 4.5习币</i><u>点击图片换装</u><div class="bbn bbnr"><inc>免费试穿</inc><button>购买</button><button>赠送</button><button>索要</button><button>收藏</button></div></cite></a></li>
</ul>
</body>
</html>
IE是个很不听话的孩子，想搞定它不容易，因为他不认识.class a:hover什么的。微软那帮孙子也够烦的，虽然国外有牛人开发了针对IE6的名"IE7"的补丁JS包，但是我看不懂。再加上不是很实用，所以就自己DIY，也不知道腾讯那帮孩子怎么搞的。呵呵，不过他们的页面有时候也有点小BUG。这次我用的方法很烂是visbility。。。不过勉强可以让我如愿。还是先赞一个偶的智慧～当然截至现在我还没有完全做完。NND。。继续～
