`

CSS从大图片上截取小图标的使用

阅读更多


注：图片名称（tabicons.png）每个小图标width:18px;height:18px

左上角的坐标为(-0px;-0px) 第一个表示图片的宽 第二个表示图标图片的高

例如第一个对号的坐标为(-0px;-0px;)第二个加号的图标为(-20px;-0px;)中间依次加20个像素

截取小图标样式

.icon-config{background-position: -20px -100px;}

使用方式： 

<div id="config" data-options="iconCls:'icon-config'"></div>



分享到：
| JAVA获取路径
评论
发表评论

您还没有登录,请您登录后再发表评论

相关推荐

    CSS截取一张图片上的所有图标

    截取一张图片的所有ICON图标 图标大小为32×32 效果图纸本人博客上有，大家可以参考。 此处无需资源分，请大家下载后留个言 算是支持下。

    JQuery&CSS;&CSS;+DIV实例大全.rar

    60.jQuery鼠标移上小图显示大缩略图功能 61.js仿淘宝网鼠标经过缩略图放大图片效果的jQuery Fancy Hover Effect完整实例 62.Supersized jQuery全屏相册图片自动切换插件 63.[荐]jquery仿flash漂亮横向图片...

    html+css移动端视口总结

    d)旋转小图标======切换横屏和竖屏 e)右上角三个圆点=== i.capture screenshot 截取手机屏幕得相关设计稿（短图） ii.capture full size screenshot 截取手机屏幕相关设计稿(带有滚动条区域得所有) 4.常见设备的大小...

    背景偏移取图标的实现方法

    通常为了减少客户端从服务器下载图片的次数，提高服务器的性能，现在比较流行的做法是将多张图片拼合成一张大图片，然后再利用background-position属性截取其中的各个小图标，如菜单，表单或导航的小图标等这种技术...

    artDialog_Demo

    17、默认皮肤改为前版的mini，没有使用任何背景图片，完全用css表现 18、修复一处隐秘BUG：当使用Ctrl+回车提交表单并弹出对话框时导致弹出新窗口 (因为此时焦点在对话框关闭链接上，这个快捷键让很多浏览器新建...

    dreamweaver网站PHP开发MXP插件

    弹出无边小窗口插件.mxp 弹出注释插件.mxp 导出EXEL格式插件.mxp 导出WORD插件.mxp 地址栏图标插件.mxp 调用CSS文件插件.mxp 动态替换CSS插件.mxp 多词搜索插件.mxp 二级下拉菜单插件.mxp 高级HTML编辑器2.01版.mxp ...

    文章管理系统

    2.[改进]改进后台文章管理 缩略图示意图，图片图标代表本地缩略图，电脑图标代表远程缩略图 3.[纠正]纠正外部调用代码会显示出未审核状态和隐藏状态的文章 4.[纠正]纠正外部调用代码对采用外部链接的文章路径没法...

    chrome.exe

    Chrome具有GPU硬件加速：当激活GPU硬件加速时，使用“Google Chrome”浏览那些含有大量图片之网站时可以更快渲染完成并使页面滚动时不会出现图像破裂的问题。 2013年4月份，Google宣布称将为Chrome浏览器开发新的...

    positionCode:通过chrome插件，在容器里面截取位置信息，生成包含相对位置信息和链接的代码

    positionCode点击柯南图标，在表单中输入你要截取位置信息的容器元素的className值。（注意使用生成的代码时，请保证该容器的样式position为relative / absolute / fixed.）

    C#编程经验技巧宝典

    103 &lt;br&gt;0167　锁定文本框内的文本　103 &lt;br&gt;0168　使用Message.Show输出用户信息　104 &lt;br&gt;5.3　图片数据处理技巧　104 &lt;br&gt;0169　如何将图片存入数据库　104 &lt;br&gt;0170　如何将图片从数据库中读取...

Magicbox
Global site tag (gtag.js) - Google Analytics