改变图标!用户自定义列表样式css说明

本文详细介绍了如何使用CSS来自定义HTML中的列表样式,包括不同场景下的列表显示效果调整,如评论列表、专题分类等,并展示了如何设置日历链接及特定日期的样式。
转:http://www.cnblogs.com/leave/archive/2005/04/13/136800.html 
<style type="text/css">
<!--
/*--------自定义列表样式开始--------*/
/*--------@ 评论列表样式定义--------*/
#show_comment li 
{list-style-image: url(../resources/icons/chat.png);margin: 10px 0px 0px -30px;}
/*--------@ 专题分类列表样式定义--------*/ 
#show_sort li 
{margin: 10px 0px 0px -25px;list-style-image: url(../resources/icons/plusfav.gif);}
/*--------@ 最新留言信息列表样式定义--------*/ 
#show_message li 
{list-style-image: url(../resources/icons/forum.gif);margin: 10px 0px 0px -30px;}
/*--------@ 最新blog文章列表样式定义--------*/ 
#show_newblog li 
{list-style-image: url(../resources/icons/deviation.gif);margin: 10px 0px 0px -30px;}
/*--------@ blog信息列表样式定义--------*/ 
#show_bloginfo li 
{margin:0px 0px 0px -40px;}
/*--------@ 日历链接移过效果--------*/ 
#calender a:hover
{color: #333;background-color: #fff;}
/*--------@ 日历有日志的日期链接效果--------*/ 
.calender_link 
{color: #333;background-color: #D3D9E4;height: 100%;width: 100%;border: 1px solid #999;font-weight: bold;display:block;}
/*--------@ 日历今天日期的效果--------*/ 
.calender_today 
{border: 1px solid #FF6600;font-weight: bold;text-decoration: blink!important;text-decoration:none;}
/*--------自定义列表样式结束--------*/
-->
</style> 
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值