CSS Sprite雪碧图使用场景-慕课网
2014-05-10
1084
版权
版权声明：
本文内容由阿里云实名注册用户自发贡献，版权归原作者所有，阿里云开发者社区不拥有其著作权，亦不承担相应法律责任。具体规则请查看《
阿里云开发者社区用户服务协议》和
《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容，填写
侵权投诉表单进行举报，一经查实，本社区将立刻删除涉嫌侵权内容。
简介：
来源：http://www.imooc.com/video/1317#0-hi-1-36977-89fdc647f52c5196c0d5da60d38d89ea
目录
相关文章
|
5月前
|
前端开发
|
5月前
|
Web App开发
前端开发
容器
|
前端开发
|
缓存
前端开发
容器
css steps 动画的使用 - 雪碧图动画
之前在时间函数那篇文章里有写到 css 动画除了支持贝塞尔曲线绘制平滑动画外，还支持使用 steps 来绘制定格/逐帧动画，但是一直没想到使用场景，直到前两天在网上看到一篇说合金弹头的帖子，突然想起来可以使用逐帧动画配合雪碧图，就可以很轻松的实现游戏中常见的雪碧图动画了，说干就干，下面我们一起来试一下。
350
0
0
|
前端开发
|
前端开发
css sprite雪碧图制作，使用以及相关，图文gif。
在网页制作中，雪碧图也是前端攻城狮必须掌握的一项小技能。百度词条对雪碧图的解释是：CSS雪碧 即CSS Sprite，也有人叫它CSS精灵，是一种CSS图像合并技术，该方法是将小图标和背景图像合并到一张图片上，然后利用css的背景定位来显示需要显示的图片部分。本文主要内容包括雪碧图如何制作，雪碧图优缺点，哪些场景需要使用雪碧图。
实现原理：
CSS雪碧的基本原理是把你的网站上用到的一些图片整合到一张单独的图片中，从而减少你的网站的HTTP请求数量。该图片使用CSS background和background-position属性渲染，这也就意味着你的标签变得更加复杂了，图片是在CSS中定义.
283
0
0
|
Web App开发
前端开发
.NET
一起谈.NET技术，在ASP.NET中自动合并小图片并使用CSS Sprite显示出来
前几天MS的ASP.NET小组推出了一个小组件：Sprite and Image Optimization Framework，用于生成Sprite CSS，及将小的图片生成一副大图。
下载地址：http://aspnet.codeplex.com/releases/view/50140
8189E6B8-FBE4-4F01-8F9F-5687C0EA9F59
下载后工程中有一个类库，一个ASP.NET WebForm示例以及一个ASP.NET MVC示例。
1309
0
0
|
前端开发
算法
4.6. CSS Sprite
1108
0
0
|
Web App开发
前端开发
css sprite
846
0
0
|
Web App开发
前端开发
缓存
【转】CSS雪碧图会占用太多浏览器内存吗
1535
0
0
热门文章
最新文章
1
【CSS进阶】使用CSS gradient制作绚丽渐变纹理背景效果（下）
2
《手把手教你》系列技巧篇（十八）-java+ selenium自动化测试-元素定位大法之By css中卷（详细教程）
3
《手把手教你》系列技巧篇（十七）-java+ selenium自动化测试-元素定位大法之By css上卷（详细教程）
4
前端代码整洁与规范之CSS篇
5
《手把手教你》系列技巧篇（十九）-java+ selenium自动化测试-元素定位大法之By css下卷（详细教程）
6
Tailwind CSS如何在vue项目中使用
7
【前端设计】HTML+CSS+JavaScript基本特性
8
【掰开揉碎】详解 CSS3 Grid 布局
9
解密CSS单位：px、em、vh的区别与应用
10
CSS 中BFC是什么？