一款很酷的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訂閱特效代碼搜索

層和布局特效推薦

猜你也喜歡看這些