使用CSS实现圈人效果(CSS Sprites)

我最早了解到”图片合并”技术, 应该是在大学游戏时代, 会发现很多游戏图标, 都会合并在一个位图中, 然后使用类似”遮罩”的技术来分别显示各种图标.
第一次使用CSS Sprites技术的时候, 其实并不知道它的这个名字, 也并没觉得多稀奇,就是个遮罩么.
今天玩开心网的圈人游戏时候, 发现它的实现是使用了Js, 突发奇想, 或许可以使用CSS Sprites来实现, 抛弃内嵌的JS.
效果如下:

图标标记
1. 显示器
17’的显示器哦~
2. 电话
听筒坏了
3. 机箱
白色的机箱
4. IBM ThinkPad
ThinkPad
5. 外置光驱
我不知道这玩意是哪里买的

有兴趣的同学, 可以直接看HTML源码, 一个独立页面的例子在这里

 收藏 (0) 打赏

您可以选择一种方式赞助本站

支付宝扫一扫赞助

微信钱包扫描赞助

除特别注明外,本站所有文章均基于CC-BY-NC-SA 4.0原创,转载请注明出处。
文章名称:《使用CSS实现圈人效果(CSS Sprites)》
文章链接:https://www.lbyxlz.com/%e4%bd%bf%e7%94%a8css%e5%ae%9e%e7%8e%b0%e5%9c%88%e4%ba%ba%e6%95%88%e6%9e%9ccss-sprites/
分享到: 生成海报

热门文章

    评论 抢沙发

    • QQ号
    • 昵称 (必填)
    • 邮箱 (必填)
    • 网址
    切换注册

    登录

    点击按钮进行验证

    忘记密码 ?

    您也可以使用第三方帐号快捷登录

    切换登录

    注册

    我们将发送一封验证邮件至你的邮箱, 请正确填写以完成账号注册和激活