div+css執行個體一款很酷的li列表樣式

來源:互聯網
上載者:User
提示:您可以先修改部分代碼再運行

<!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"><head><title></title><meta http-equiv="content-type" content="text/html;charset=gb2312"><!--把下面代碼加到<head>與</head>之間--><style type="text/css"><!--body{background-color:#f1f1f1;}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><!--把下面代碼加到<body>與</body>之間--><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">一款很酷的li列表樣式</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">VKFlash帶後台管理的圖片切換ASP版</span></li> <li><span onMouseOver="this.className='liOver'" onMouseOut="this.className='liout'" onMousedown="this.className='lidown'" class="liout">QVMS電影系統ASP版帶採集產生HTML</span></li> <li><span onMouseOver="this.className='liOver'" onMouseOut="this.className='liout'" onMousedown="this.className='lidown'" class="liout">一個漂亮的JS日期顯示框</span></li> <li><span onMouseOver="this.className='liOver'" onMouseOut="this.className='liout'" onMousedown="this.className='lidown'" class="liout">VB多種方法實現啟動、停止系統服務</span></li> <li><span onMouseOver="this.className='liOver'" onMouseOut="this.className='liout'" onMousedown="this.className='lidown'" class="liout">C#連連看遊戲原始碼拳皇頭像版</span></li> </ul> </td> </tr></table></body></html>
提示:您可以先修改部分代碼再運行
相關文章

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.