找回密码
 注册

QQ登录

只需一步,快速开始

查看: 2008|回复: 7

[讨论] li 前面的list-style

[复制链接]
发表于 2010-12-29 10:24:54 | 显示全部楼层 |阅读模式
我在设置    这里的list-style<li><a></a></li>    时候随便看了看百度怎么做的,发现他是用的背景图,让我不解的是-比如百度新闻列表:


.list2 LI {
        LINE-HEIGHT: 24px; PADDING-LEFT: 10px; BACKGROUND: url(../../img/icon.gif?v=1.1) no-repeat -21px -73px; HEIGHT: 24px; FONT-SIZE: 14px; OVERFLOW: hidden
}


这样写是什么意思??!!这里的参数是什么意思????!!请赐教
发表于 2010-12-29 14:16:49 | 显示全部楼层
icon.gif是图片集, 后面的“-21px”“-73px”是定义的这列表的图在图片集中的位置,是针对该图片左上角的点的位置。多学习下就知道了。目前这种方式广泛应用。
回复 支持 反对

使用道具 举报

发表于 2010-12-29 21:41:48 | 显示全部楼层
时间戳吧,是避免你访问到了缓存里的文件。你可以忽略?v=1.1
回复 支持 反对

使用道具 举报

发表于 2010-12-30 08:37:30 | 显示全部楼层
这个的问题   ul ol 前面的点 在不同浏览器是不兼容的,所以 都不会用默认的list-style:   都会 用list-style:none;然后用背景来实现就像你看到的那样    后面的  一般都会用背景图来实现   控制x y的距离  或者有  背景图合并调   基本就是背景图了就看你怎么用了
回复 支持 反对

使用道具 举报

 楼主| 发表于 2010-12-30 12:27:58 | 显示全部楼层

3楼回答的还可以

我的意思就是3楼要说的,就是感觉不怎么理解,那个什么XY我是知道,我问的是“图片带参数”问题
回复 支持 反对

使用道具 举报

发表于 2010-12-30 16:12:26 | 显示全部楼层
css sprite
回复 支持 反对

使用道具 举报

发表于 2011-1-5 21:01:32 | 显示全部楼层
list-style-image是非常不好控制的。
一般做法是用background来模拟,当然也可以用一个冗余的<b></b>来单独显示背景图片,这对于列表树操作特别方便,比如该b标签来展现如window资源管理器文件树前的 + - 号。
回复 支持 反对

使用道具 举报

发表于 2011-1-6 08:23:38 | 显示全部楼层
原帖由 [i]myselfdo 于 2010-12-30 12:27 发表
我的意思就是3楼要说的,就是感觉不怎么理解,那个什么XY我是知道,我问的是“图片带参数”问题


有时间研究下浏览器缓存机制~
回复 支持 反对

使用道具 举报

您需要登录后才可以回帖 登录 | 注册

本版积分规则

小黑屋|Archiver|手机版|blueidea.com ( 湘ICP备12001430号 )

GMT+8, 2021-2-28 09:05 , Processed in 0.057554 second(s), 10 queries , Gzip On, Memcache On.

Powered by Discuz! X3.2 Licensed

© 2001-2013 Comsenz Inc.

快速回复 返回顶部 返回列表