神圣精灵 Chris Coyier 于 2009年11月2日 DigitalOcean 为您旅程的每个阶段提供云产品。 立即开始使用 200 美元的免费额度! 许多人参加了有趣的 展示你的精灵! 比赛。 我使用了老式的 随机数生成器 并选出了 Lee Kowalkowski 作为大赢家,恭喜 Lee!现在让我们看看一些提交的作品。 我发现精灵看起来很奇怪,很迷人。 它就像网络上一种奇怪的秘密语言,只有我们这些性能极客才能真正理解 =) 其中一些可能已经被裁剪或调整大小。 它们不适合直接拿来使用,我只是希望它们能激发灵感! 如果您只是浏览了所有这些,并且想“嗯,那是什么?” 这些叫做 CSS 精灵,您可以 在这里了解它们。
喜欢波斯王子那个 :D
绝对的!!!
波斯王子来自哪里?
波斯。
哦,天哪,这让我笑了。
完美的答案! 让我的一天都变得美好! 谢谢!
从技术上讲,现在是伊朗。
我想他指的是哪个网站。 但是的,如果他是想知道这个,那确实是一个有趣的问题/答案。
别瞒着我们! 如果您能将每个精灵链接到其网站,以便我们查看其使用情况,那就太好了。 干杯
它来自 80 年代同名的一款非常古老的电子游戏(波斯王子)。 可悲的是,我年纪够大,小时候玩过它,留下了美好的回忆;)
顺便说一句,术语“精灵”也源于此
嘿嘿。
很棒的帖子,看到精灵被如此频繁地使用真是太棒了!
我之前以为精灵最适合用于具有不同状态(活动、悬停、已访问)等的项目……我没想到人们可以并且确实将此技术用于他们大多数的小型布局元素。
很棒的合集。
喜欢 Warsprite 和波斯王子,波斯王子的制作肯定花费了大量时间。 然后是我的第一个 ;),希望我能赢得那本书 :D
我不得不承认波斯王子是我的最爱……我认为这是因为它唤起了如此美好的回忆,尽管我不确定为什么,因为我在这款游戏中很糟糕。
不过它们看起来都很好
请分享我们可以看到这个“波斯王子”实际用法的网站。 这个看起来很棒。
精灵真的很酷,如果有人想查看我的:http://indiepaper.com/images/indiepaper2/container_bg.png
无论如何,比赛的想法不错(不过,我在索引中没有看到它,是在其他地方发布的吗?)
精灵当然很酷……而且显然已经发展了很多!
但这是我的问题:在创建像这样的精灵时,您(轻松地?)如何设置/记住/控制必要的定位?
我处理按钮鼠标悬停的简单 2 或 3 状态精灵已经够难了……我无法想象能够快速/轻松地设置这些的定位! =:O
使用 Photoshop 等程序,这并不难。 只要您不移动太多,就可以轻松修改精灵的任何部分,并且您的 CSS 应该编写得清晰简洁,以显示其每个部分。
大多数情况下,除非您正在修改网站的一部分,否则您不会重新排列精灵,然后您几乎会再次找到状态。 我使用自己的技术(使用 Photoshop 标尺、裁剪)来查找坐标,但为了精确到像素,我还使用 Web 开发人员工具栏和编辑 CSS 选项。
有时我发现使用 Firebug 并检查具有背景的元素很有用。 然后,您可以单击 px 值并使用箭头键(向上或向下)向上或向下更改值。
感谢您包含我的,Chris!
有人应该为我们这些精灵极客创建一个类似于 CSS 画廊的网站。
完美!
如果内容包含它们来自的 URL,会更好~
不错…
有谁知道更宽的(水平)精灵比更高的(垂直)精灵效率更高吗? 一个比另一个有什么优势吗?
我认为没关系。 像素就是像素,无论哪个方向。
也许很明显,但也不要同时使用两种方式。 尽量将尽可能多的内容打包到尽可能小的表面积中。 变得非常宽和非常高并留下空隙是适得其反的。
看到我创建的 WAR 导航按钮在这里展示真的很酷。 谢谢!
谢谢,这就是我正在寻找的
我在星期五做了我的第一个精灵,我非常兴奋以后要为我所有的网站都使用它们 :-)
把缅因州卖给加拿大。
哈哈
很棒的东西。
哇,精灵的收藏很不错 :D