运行代码框
<style> /*频道链接样式*/ .channel { width:350px; margin:12px 0px 0px 175px; height:30px; line-height:30px; text-align:center; } .channel ul { list-style:none; margin:0px;} .channel li { float:left; padding-left:8px; } .channel a { background:url(/articleimg/2006/04/3385/arrow2.gif) no-repeat left; padding-left:10px; color:#457a8b; font-size:14px; font-weight:bold; } .channel a:link { background:url(/articleimg/2006/04/3385/arrow2.gif) no-repeat left; padding-left:10px; color:#457a8b; } .channel a:visited { background:url(/articleimg/2006/04/3385/arrow2.gif) no-repeat left; padding-left:10px; color:#457a8b; } .channel a:hover { background:url(/articleimg/2006/04/3385/arrow1.gif) no-repeat left; padding-left:10px; color:#78b4c7; } .channel a:active { background:url(/articleimg/2006/04/3385/arrow1.gif) no-repeat left; padding-left:10px; color:#78b4c7; } </style> <body> <div class="channel"> <UL> <LI><A title=文化频道 href="http://www.rr1mea.cn/Culture">文化频道</A></LI> <LI><A title=音乐频道 href="http://www.q1iangzu.com/music">音乐</A></LI> <LI><A title=专题 href="http://www.rrme1a.cn/Topic">专题</A></LI> <LI><A title=博客 href="http://www.qian1gzu.com/bbs/bokeindex.asp">博客</A></LI> <LI><A title=尔玛论坛 href="http://www.qian1gzu.com/bbs/index.asp">尔玛论坛</A></LI></UL></div> </body>
[Ctrl+A 全部选择 提示:你可先修改部分代码,再按运行]
CSS文件:
/*频道链接样式*/.channel { width:350px; margin:12px 0px 0px 175px; height:30px; line-height:30px; text-align:center; }.channel ul { list-style:none; margin:0px;}.channel li { float:left; padding-left:8px; }.channel a { background:url(http://www.rrmea.cn/skin/Blue/arrow2.gif) no-repeat left; padding-left:10px; color:#457a8b; font-size:14px; font-weight:bold; }.channel a:link { background:url(http://www.rrmea.cn/skin/Blue/arrow2.gif) no-repeat left; padding-left:10px; color:#457a8b; }.channel a:visited { background:url(http://www.rrmea.cn/skin/Blue/arrow2.gif) no-repeat left; padding-left:10px; color:#457a8b; }.channel a:hover { background:url(http://www.rrmea.cn/skin/Blue/arrow1.gif) no-repeat left; padding-left:10px; color:#78b4c7; }.channel a:active { background:url(http://www.rrmea.cn/skin/Blue/arrow1.gif) no-repeat left; padding-left:10px; color:#78b4c7; }
图片文件下载:
arrow1.gifarrow2.gif
DIV文件:
<div class="channel"><UL><LI><A title=文化频道 href="http://www.rrmea.cn/Culture">文化频道</A></LI><LI><A title=音乐频道 href="http://www.qiangzu.com/music">音乐</A></LI><LI><A title=专题 href="http://www.rrmea.cn/Topic">专题</A></LI><LI><A title=博客 href="http://www.qiangzu.com/bbs/bokeindex.asp">博客</A></LI><LI><A title=尔玛论坛 href="http://www.qiangzu.com/bbs/index.asp">尔玛论坛</A></LI></UL></div>
Copyright @ 2007-2012 敏韬网(敏而好学,文韬武略--MinTao.Net)(学习笔记) Inc All Rights Reserved. 闵涛 E_mail:admin@mintao.net(欢迎提供学习资源)
鄂公网安备 42011102001154号
站长:MinTao ICP备案号:鄂ICP备11006601号-18