div+css+js隔行换色+鼠标悬停变色

很有用的隔行换色,而且鼠标悬停变色,其结果如下:

html源代码是如此的精简,CSS和JS再次疏散html源代码,精简何等优美。上图:

悬停变色哦

简朴贴下li标签的源码:

<div> <ul> <li><a href="#">这个是第1行的文字,各人看清楚了</a></li> <li><a href="#">这个是第2行的文字,各人看清楚了</a></li> <li><a href="#">这个是第3行的文字,各人看清楚了</a></li> <li><a href="#">这个是第4行的文字,各人看清楚了</a></li> <li><a href="#">这个是第5行的文字,各人看清楚了</a></li> <li><a href="#">这个是第6行的文字,各人看清楚了</a></li> <li><a href="#">这个是第7行的文字,各人看清楚了</a></li> <li><a href="#">这个是第8行的文字,各人看清楚了</a></li> <li><a href="#">这个是第9行的文字,各人看清楚了</a></li> </ul> </div>

1、这样的长处首先是不消可恶的table,让前端措施是那么的雅观。让内容被度娘儿轻轻抚摸…………(pooxx不知道说了什么,是利便搜索引擎抓取,精简HTML源码。)

2、没有在每句li里写onfocus、onclick ……你想想on on 就一句<li>标签,塞进了一堆的代码。你说肿么了。不肿才怪。

3、不消写ID,还原真实的静态页面,不消修改和添加几多的id啊 class啊…………

@%!%@……(说不完了上源码)

end

附件下载/演示源码:
【 li_bg.rar 】 32.09KB

内容版权声明:除非注明,否则皆为本站原创文章。

转载注明出处:https://www.heiqu.com/7896.html