链接内容可以点击的文字提示_文本链接特效

模板酷站
  •       3/5
  •       1
  •       2
  •       3
  •       4
  •       5
查看演示效果

      织梦DedeCMS视频教程买空间 租服务器 选网硕互联! 无忧站长工具,百度权重一键全查!

      链接内容可以点击的文字提示

      <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> <head> <meta http-equiv="Content-Type" mrc="text/html; charset=gb2312" /> <meta name="author" mrc="宇,zy.e@163.com" /> <title>w3css.com</title> <style type="text/css"> <!-- body { background:#F4F8FF; margin: 0px; font: 12px/130% arial,宋体,verdana,sans-serif;color: #000; padding: 0px; } li{ list-style:none; } *{ margin: 0; padding: 0; } .fenlei{height:50px; width: 300px; padding: 5px; line-height: 30px;margin-top: 20px;} .fenleiul { float:left;} .fenleiul li{ width: 101px;float: left;height: 30px; padding-left:12px;} .fenleiul li a{ display:block; width: 101px; background: url(http://www.w3css.com/down/ico1.gif) 1px 11px no-repeat; line-height: 30px; float: left; padding-left:12px; color: #069; text-decoration:none; } .fenleiul li a:visited{ background: url(http://www.w3css.com/down/ico2.gif) 1px 11px no-repeat; color: #069;} .fenleiul li a:hover{ background: url(http://www.w3css.com/down/ico.gif) 1px 11px no-repeat;color: #FF4500;} .postitle{filter:alpha(opacity=80);-moz-opacity:0.8;opacity: 0.8; background: url(http://www.w3css.com/down/jt.gif) 0 -10px no-repeat; margin-top: -12px; float:left;margin-left:70px;*margin-left:-40px; position:absolute;} .type{line-height: 16px; float: left; clear: both; background: #D9F6FF; width:120px; margin-left:21px;padding:3px; overflow: hidden; border: solid 1px #9EB6D8; border-left:none;} .fenlei .type a{ clear:both;background-image:none; padding-left:0;line-height: 16px;} .type a:link{color:#004A75;} .type a:visited{ color:#333;} .fenlei .type a:hover{ color:#DC143C;background-image:none;} .flnone{ display:none; } --> </style> </head> <body> <div class="fenlei" > <ul class="fenleiul" id="listyle"> <li><a href="/soft/1900.html" >暗黑之门</a><div class="flnone"><span class="type">最新客户端:<a href="1#">劲乐团圣诞童话</a><br /><a href="1#">劲乐团圣诞童话</a></span></div></li> <li><a href="/soft/1900.html">宝贝坦克x</a><div class="flnone"><span class="type">最新客户端:<a href="#">劲乐团圣诞童话1</a></span></div></li> <li><a href="/soft/1900.html">超级武林大富</a><div class="flnone"><span class="type">最新客户端:<a href="#">劲乐团圣诞童话1</a></span></div></li> <li><a href="/soft/1900.html">魔力宝贝Ⅱ</a><div class="flnone"><span class="type">最新客户端:<a href="#">劲乐团圣诞童话1</a></span></div></li> <li><a href="/soft/1900.html">神泣(Shaiya)</a><div class="flnone"><span class="type">最新客户端:<a href="#">劲乐团圣诞童话1</a></span></div></li> <li><a href="/soft/1900.html">奇迹世界(SUN)</a><div class="flnone"><span class="type">最新客户端:<a href="#">劲乐团圣诞童话1</a></span></div></li> </ul> </div> <script type="text/javascript"> var listyle = document.getElementById("listyle") var lis = listyle.getElementsByTagName("li"); var divs = listyle.getElementsByTagName("div"); for (var tn = 0; tn < lis.length; tn++) { lis[tn].tn = tn; lis[tn].onmouseover = show; lis[tn].onmouseout = unshow; } function unshow() { for (var i = 0; i < divs.length; i++) { divs[i].className = "flnone"; } } function show(tn) { unshow(); divs[this.tn].className = "postitle"; } </script> </body> </html>