<ul>
<li><span>第一块</span></li>
<li><span>第二块</span></li>
<li><span>第三块</span></li>
<li><span>第四块</span></li>
<li><span>第五块</span></li>
</ul>
CSS可以改成这样:
Example Source Code []
*{margin:0; padding:0; list-style:none;}
li {height:100px; margin:0 5px 0 0; float:left; width:100px; background:#000;}
li:hover {position:relative; z-index:1;}
li span {width:200px; height:200px; background:#c00; position:absolute; top:0; left:100px; z-index:1000; display:none;}
li:hover span {display:block;}
Source Code to Run []
[ 可先修改部分代码 再运行查看效果 ]
原始阅读: