事实上各式Tooltips方法非常多. 不过大部分都是用JavaScript实现. 我们对类加入position:relative属性,使得span标签的位置能够紧跟在链接后面.
<br /><br /><br /><br /><br /><a class="tooltips" href="#tooltips">这就是Tooltips<span>如你所见,这些附加的说明文字在鼠标经过的时候显示。</span></a><style type="text/<a href="http://www.blue1000.com/bkhtml/c23/" title="CSS教程">CSS</a>">/*Tooltips*/.tooltips{position:relative; /*这个是关键*/z-index:2;}.tooltips:hover{z-index:3;background:none; /*没有这个在IE中不可用*/}.tooltips span{display: none;}.tooltips:hover span{ /*span 标签仅在 :hover 状态时显示*/display:block;position:absolute;top:21px;left:9px;width:15em;border:1px solid black;background-color:#ccFFFF;padding: 3px;color:black;}</style>
其中定义z-index以确保弹出的Tooltips层在最上面。
Copyright @ 2007-2012 敏韬网(敏而好学,文韬武略--MinTao.Net)(学习笔记) Inc All Rights Reserved. 闵涛 E_mail:admin@mintao.net(欢迎提供学习资源)
鄂公网安备 42011102001154号
站长:MinTao ICP备案号:鄂ICP备11006601号-18