{
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}
/*定义链接效果，不要太复杂，以免和SPAN的样式混扰，*/
LI
{
list-style-type:square;
/*list-style-image:url("http://www.51js.com/faq.gif"); */
margin:0px;
padding:0px;
height:15px;
/*定义了列表的行高，注意不要设置太高，以免列表和符号脱节，*/
}
LI IMG
{
cursor:hand;
margin:0px;
padding:0px;
}
LI SPAN
{
color:black;
cursor:hand;
text-decoration:none;
/*定义列表中文字及鼠标指针的样式*/
border:1px solid #F1F1F1;
/*定义了SPAN的边框及颜色。*/
margin:0px;
padding-left:1px;
padding-right:0px;
padding-top:0px;
padding-bottom:0px;
position:relative;
/*以上定义列表SPAN之间的间距。*/
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;
}
--
超COOL的LIST样式
以下效果只用到两张小图片作为列表符号，没有用到表格，都是用样式表进行定义，可定义的参数为：
LI的符号样式；
链接的样式；
SPAN的样式；
如果能够进行很好的配色及背景搭配，就可以做出非常好的效果。
不但改变了列表符号，而且改变了链接效果，还改变了SPAN的样式！COOL！
不但改变了列表符号，而且改变了链接效果，还改变了SPAN的样式！COOL！
不但改变了列表符号，而且改变了链接效果，还改变了SPAN的样式！COOL！
不但改变了列表符号，而且改变了链接效果，还改变了SPAN的样式！COOL！
不但改变了列表符号，而且改变了链接效果，还改变了SPAN的样式！COOL！
不但改变了列表符号，而且改变了链接效果，还改变了SPAN的样式！COOL！
不但改变了列表符号，而且改变了链接效果，还改变了SPAN的样式！COOL！
不但改变了列表符号，而且改变了链接效果，还改变了SPAN的样式！COOL！
不但改变了列表符号，而且改变了链接效果，还改变了SPAN的样式！COOL！
FROM：网页教学网(webjx.com)
