一款很酷的li列表美化实例_层和布局特效

一个很酷的UL/LI列表美化样式，正在发愁不知如何美化列表的朋友可以参考一下，本列表有着极漂亮的鼠标悬停效果，不信你把鼠标放上去试试看。

<html>
<head>
<title>一款很酷的li列表美化实例</title>
<meta http-equiv="Content-Type" mrc="text/html; charset=gb2312">
<style>
<!--BODY,td
 {
 font-family:verdana;
 cursor:default;
 font-size:12px;
 }

a{font-size:12px; color:#006699; line-height:160%; text-decoration:none }
a:link{font-size:12px; color:#006699; line-height:160%; text-decoration:none }
a:active{font-size:12px;color:#990000; line-height:160%;}
a:hover{font-size:12px; color:#3366ff; line-height:160%; text-decoration:none}

LI
 {
 list-style-type:square; 
 margin:0px;
 padding:0px;
 height:15px;
 }

LI SPAN
 {
 color:black;
 cursor:hand;
 text-decoration:none;
 border:1px solid #F1F1F1;
 margin:0px;
 padding-left:1px;
 padding-right:0px;
 padding-top:0px;
 padding-bottom:0px;
 position:relative;
 top:0px;
 left:-1px;
 }

.liOver
 {
 background-color:#dddddd;
 border:1px solid #000000;
 }
.liout
 {
 background-color:#f1f1f1;
 border:1px solid #f1f1f1;
 }
LI SPAN.lidown
 {
 background-color:#00ff00;
 border:1px solid #999999;
 }
-->
</style>
</head>
<body bgcolor="#f1f1f1">
<table width="300" border="1" cellpadding="5" cellspacing="0" bordercolorlight="#999999" bordercolordark="#FFFFFF" align="center">
 <tr bgcolor="#CCCCFF"> 
 <td width="300"> 
 <div align="center"><font color="#000000">一款很酷的LIST列表样式</font></div>
 </td>
 </tr>
 <tr> 
 <td width="300"> 
 <ul>
 <li><span onMouseOver="this.className = 'liOver'" onMouseOut="this.className='liout'" onMousedown="this.className='lidown'" class="liout"><a href="#">VKFlash 带后台管理的图片切换ASP版</a></span></li>
 <li><span onMouseOver="this.className = 'liOver'" onMouseOut="this.className='liout'" onMousedown="this.className='lidown'" class="liout"><a href="#">QVMS电影系统ASP版带采集生成HTML</a></span></li>
 <li><span onMouseOver="this.className = 'liOver'" onMouseOut="this.className='liout'" onMousedown="this.className='lidown'" class="liout"><a href="#">一个漂亮的JS日期显示框</a></span></li>
 <li><span onMouseOver="this.className = 'liOver'" onMouseOut="this.className='liout'" onMousedown="this.className='lidown'" class="liout"><a href="#">VB多种方法实现启动、停止系统服务</a></span></li>
 <li><span onMouseOver="this.className = 'liOver'" onMouseOut="this.className='liout'" onMousedown="this.className='lidown'" class="liout"><a href="#">C# 连连看游戏源代码拳皇头像版</a></span></li>
 </ul>
 </td>
 </tr>
</table>
</body>
</html>

所属频道：层和布局特效/更新时间：2013-01-08

[收藏][报错][返回列表]

一款很酷的li列表美化实例_层和布局特效

层和布局特效Rss订阅特效代码搜索

层和布局特效推荐

猜你也喜欢看这些