二倍图(精灵图的用法)

1.引入图片。在fireworks中限制宽高,然后把宽高设置成现在的一半

2,采用切片工具进行切片,获取精灵图的坐标

原文地址:https://www.cnblogs.com/qdxbls/p/11057858.html

时间: 2024-10-12 19:10:05

二倍图(精灵图的用法)的相关文章

如何在普清的屏上调试CSS样式二倍图背景

吐槽: 随着现在越来越多人装B,特别是一些产品经理. 现在也在换新的笔记本电脑,苹果的笔记本又是装B利器(特别是retina的pro). 最近就遇到一个同事的项目,还是像平常一样小心切图,认真对像素. 一切测试都没有问题,顺利上线. 但是,上线之后,产品经理跑过来说,有BUG. BUG描述:(不认为是BUG) 前端页面上的图标是虚的. 环境:mackbook pro retina屏 现象: 给了一个截图 图标是虚的 BUG修复要求: 对图标进行修正,使在retina屏上图标依旧是清晰的. 分析:

Css Sprite(雪碧图、精灵图)<图像拼合技术>

一.精灵图使用场景: 二.Css Sprite(优点) 减少图片的字节. 减少网页的http请求,从而大大的提高页面的性能. 解决了网页设计师在图片命名上的困扰,只需对一张集合的图片上命名就可以了,不需要对每一个小元素进行命名,从而提高了网页的制作效率. 更换风格方便,只需要在一张或少张图片上修改图片的颜色或样式,整个网页的风格就可以改变.维护起来更加方便. 三.实现原理 css background-position 控制一个层可显示的区域范围大小,通过一个窗口进行背景图的滑动实例: 代码如下

浮动的特性/常用的CSS属性/精灵图技术(background-image)/定位

一.关于上篇博客的回顾 1.浮动: (1).标准文档流 (2).作用:实现元素并排 (3).特点:第一个盒子会贴父盒子的边,第二个会贴第一个盒子的边... (4).特性: ①.脱离标准文档流 ②.收缩效果 ③.字围 ④.设置浮动,任意的标签都可以设置宽高 (5).总结:要浮动一起浮动,有浮动,清除浮动 (6).浮动带来的影响:如果父盒子不设置高度,子盒子浮动了,因为子盒子脱离了标准文档流,那么他们不在页面上占位置,撑不起父盒子的高度 2.清除浮动: (1).给父盒子设置固定高度(后期不好维护)

用一篇文章了解ppi,dpr,物理像素,逻辑像素,以及二倍图

这篇文章能让你了解到什么是分辨率.dpr.dip.ppi (dpi相当于ppi,dpi用点表示物理像素) 首先从最简单的ppi开始: 一部手机,有大有小,怎么知道手机的大小用尺子量一量即可,有两条边量哪一条呢?勾股定理告诉我们斜边越大,面积就越大,量斜边没跑了.量的单位可不是cm,而是英寸.1英寸= 2.54cm,这个相信看过<新华字典>或<现代汉语词典>的人都知道,上面附有计量单位表. 嘿嘿,又引出了一个物理像素的概念:物理像素就是分辨率的那两个数字,两个数字代表了长宽两条边物理

视觉SLAM漫淡(二):图优化理论与g2o的使用

视觉SLAM漫谈(二):图优化理论与g2o的使用 1    前言以及回顾 各位朋友,自从上一篇<视觉SLAM漫谈>写成以来已经有一段时间了.我收到几位热心读者的邮件.有的希望我介绍一下当前视觉SLAM程序的实用程度,更多的人希望了解一下前文提到的g2o优化库.因此我另写一篇小文章来专门介绍这个新玩意. 在开始本篇文章正文以前,我们先来回顾一下图优化SLAM问题的提法.至于SLAM更基础的内容,例如SLAM是什么东西等等,请参见上一篇文章.我们直接进入较深层次的讨论.首先,关于我们要做的事情,你

Python爬虫利器二之Beautiful Soup的用法

上一节我们介绍了正则表达式,它的内容其实还是蛮多的,如果一个正则匹配稍有差池,那可能程序就处在永久的循环之中,而且有的小伙伴们也对写正则表达式的写法用得不熟练,没关系,我们还有一个更强大的工具,叫Beautiful Soup,有了它我们可以很方便地提取出HTML或XML标签中的内容,实在是方便,这一节就让我们一起来感受一下Beautiful Soup的强大吧. 1. Beautiful Soup的简介 简单来说,Beautiful Soup是python的一个库,最主要的功能是从网页抓取数据.官

UML学习(二)-----类图

UML学习(二)-----类图 http://www.cnblogs.com/silent2012/archive/2011/09/07/2169946.html http://www.cnblogs.com/yangfengming/archive/2008/08/14/1267495.html http://www.cnblogs.com/huangxincheng/archive/2012/10/17/2728736.html http://www.cnblogs.com/playing/

精灵图技术

在加载图片时,每加载一次,就向网络中发送一次请求icon为小图标,同样需要向网络发送请求为了节省网络资源,将页面中需要用到的icon集成到一张图中,使用时,只需发送一次请求即可在css文件中使用时,只需要使用到icon在整张图中的相对位置即可,使用background-position:;是icon显示出来 <body> <div class="icon icon-1"></div> <div class="icon icon-2&q

三十二、Java图形化界面设计——布局管理器之CardLayout(卡片布局)

摘自 http://blog.csdn.net/liujun13579/article/details/7773945 三十二.Java图形化界面设计--布局管理器之CardLayout(卡片布局) 卡片布局能够让多个组件共享同一个显示空间,共享空间的组件之间的关系就像一叠牌,组件叠在一起,初始时显示该空间中第一个添加的组件,通过CardLayout类提供的方法可以切换该空间中显示的组件. 1.  CardLayout类的常用构造函数及方法 2.  使用CardLayout类提供的方法可以切换显