css3怎么把列表图标弄成每列的图标都不一样

html-css012

css3怎么把列表图标弄成每列的图标都不一样,第1张

每个ul一个class类如:

<ul class="u01"><li>01</li><li>02</li></ul>

<ul class="u02"><li>001</li><li>002</li></ul>

ul.u01>li{样式}

ul.u02>li{样式}

如果是图片的尺寸太大,要修改小一些。这种情况,通常都是使用雪碧图或者字体图标来做的。当然如果这些都不能满足你的需求,你也可以直接放图片,可以自己处理一张符合你需求的尺寸图片,也可以忽略图片的大小,然后使用css调整图片的尺寸大小即可,但是像素可能会被压缩。所以要根据自己的具体需求使用比较合适的解决方案。下面给你写一个案例。你可以参考是否符合自己的需求

1.每条新闻前要有图标 不知道图标是不是一样的,还是1.2.3……这种排名形式

·如果图标都是一样的,那就切一个小图标,作为li的背景,也可以设置list-style-image:url()差不多就这两种方法

·如果图标不一样,就把这些图标竖着排到一张图片里,作为ul的背景。然后设置li的行高,让每一行li与每个图标对齐。

2.每天添加的新闻后面有个NEW。

这个要让你们搞后台的同学设置一下,写个判断,获取更新日期与当前日期,如果更新日期=当前日期(天数),那么就显示new的图标。一般的cms都有方法调用的