<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www./TR/xhtml1/DTD/xhtml1-strict.dtd">
<title>层提示效果</title> <style> div{ clear:both; margin:5px 0 0 0; font-size:12px; line-height:22px; } a.alt{ position:relative; background-color:#fff; float:left; width:158px;height:20px; margin:0 auto; border:1px solid #ccc; text-align:center; text-decoration:none; color:#333333; } a.alt:hover{background:#fff; text-decoration:none;z-index:2;} a.alt span{display:none;} a.alt:hover span{ position:absolute; display:block; top:-1px;left:158px; width:120px;height:70px; border:1px solid #ccc; z-index:1; background-color:#fff; } </style> <div><a class='alt' href="#"><span>站长资讯 | 我们致力于为中文网站提供动力!</span>中国站长站</a></div>
<div><a class='alt' href="#"><span>站长资讯 | 我们致力于为中文网站提供动力!</span>中国站长站</a></div> <div><a class='alt' href="#"><span>站长资讯 | 我们致力于为中文网站提供动力!</span>中国站长站</a></div> <div><a class='alt' href="#"><span>站长资讯 | 我们致力于为中文网站提供动力!</span>中国站长站</a></div> <div><a class='alt' href="#"><span>站长资讯 | 我们致力于为中文网站提供动力!</span>中国站长站</a></div> |
|
来自: 万子千秋 > 《javascript特效积累》