仓酷云

 找回密码
 立即注册
搜索
热搜: 活动 交友 discuz
查看: 982|回复: 7
打印 上一主题 下一主题

[HTML5] 来一发css sprites合用局限和css sprites的利害

[复制链接]
若相依 该用户已被删除
跳转到指定楼层
楼主
发表于 2015-1-15 23:11:46 | 只看该作者 回帖奖励 |倒序浏览 |阅读模式

马上注册,结交更多好友,享用更多功能,让你轻松玩转社区。

您需要 登录 才可以下载或查看,没有帐号?立即注册

x
HTML5开发的网页文档类型极其简单,就够了,记得5年前还在反复跟团队强调使用XHTML那段冗长的文档类型声明.网页制造Webjx文章简介:CSSsprites的利害.
csssprites的利害
关于这项手艺,最年夜的优点有上面几个:
1,削减网页加载时的http哀求数。这类情形貌似只合用于“初度加载”之类必要从头从服务器端猎取资本的情形。但不管如何,关于一个流量较年夜大概频仍被“从头加载”的网页,仍是很有效的。
2,给链接做背景图时,能够避免a:hover时再载进背景图片而招致的背景“闪灼”。团体以为这一点在提拔用户体验具有必定的意义。
3,图片易于办理。条件是拼合的图片有必定的纪律。以下图,就是一张“网站全体利用的按钮背景”的图片。如许能够很直不雅的看到网站中一切的按钮款式。(我团体喜好依照图片的必定“属性”来拼图片,一张图片都是icon大概都是btn背景…如许就能够特地办理图片,且有必定纪律可循的图片,对照简单分列在一同。固然,有些时分,也会选择依照“模块”来拼合一张图片,如许在模块化的布局中,就发生了一个复杂的逻辑:挪用一个模块,则挪用下面的背景图。不然,这张图片就不被挪用。能够无效的避免只用了一个小小的图标,就挪用了全部年夜图片的成绩。)

csssprites合用局限:
1,必要经由过程下降http哀求数完成网页减速。
2,网页中含有大批小图标。大概,某些图标通用性很强。
3,网页中有必要预载的图片。次要是a与a:hover背景图这类干系的。假如a与a:hover的背景图分离加载,那末,就会呈现用户鼠标移到某个按钮上,按钮的背景俄然消散再出来,发生“闪灼”,假如按钮笔墨色与年夜背景不异或邻近,就更辶耍锌赡苋萌瞬磁“消散”了的错觉。
必要满意的前提
在网页中,经由过程这项手艺拼合在一同的图片最好有一项纪律。定宽大概定高。最好是宽高都能定上去。必要平展的图片,明显不合适sprite。
如上图的buttons,就属于定宽定高的情形。
定宽情形下,则可平行分列多少小图片。定高,则纵向分列小图片。
若背景既不定宽,也不定高情形下强利用用csssprites手艺,则简单发生“不该该呈现的图片呈现在页面上”的形态。如果“强行定高”,也将十分倒霉于往后的保护。
总结
这项手艺好与欠好其实不能混为一谈的。要视网站的详细情形而定。剖析时起首决意本人“是不是必要”,还要综合开辟本钱,保护本钱等成绩。找到一个合适实践情形的计划再做决断。实时要用sprites,倡议也不要极度的将各类尺寸,各类对齐体例,各类用处图片放在一同往保护。如许的极度也许不克不及再削减几个http哀求数,反而为往后的保护埋下隐患。
</p>
这不是理想状况。我们必须尽可能把精力放在改善这项规范,把耗费在派系相争的精力降到最低。
不帅 该用户已被删除
沙发
发表于 2015-1-17 20:42:17 | 只看该作者
以上大概就是文字图片的一些链接方法,通过学习Dreamweaver、练习让我对dreameaver8有了进一步的认识,他其实是一款很好的建立Web站点和应用程序的软件。它将可视布局工具、应用程序开发功能和代码编辑支持组合在一起,其功能强大,使得各个层次的开发人员和设计人员都能够快速创建界面吸引人的基于标准的网站和应用程序。
山那边是海 该用户已被删除
板凳
发表于 2015-1-24 08:09:58 | 只看该作者
是当我和赵丽芬崔明艳老师进行交流后,很快就了解了还不太清楚的内容和并不了解的知识(像布局表格、绘制布局单元格等)。
爱飞 该用户已被删除
地板
发表于 2015-2-1 07:20:40 | 只看该作者
Dreamweaver在所见即所得添加链接,也可以先选中文字或图片然后在属性栏中的链接栏后的一个小圆圈,用鼠标点击小圆圈按住不放拖动出箭头然后指向文件即可。
小魔女 该用户已被删除
5#
发表于 2015-2-7 03:13:34 | 只看该作者
足见市场的反响和MACROMEDIA公司对它们的自信。说到Dreamweaver8我们应该了解一下网页编辑器的发展过程,随着互联网(Internet) 的家喻户晓。
乐观 该用户已被删除
6#
发表于 2015-2-20 13:51:18 | 只看该作者
经过两天的学习,总算对Dreamweaver有进一步的了解了,心中不免有些激动。今天和其他几位老师交流了一下,感觉受益匪浅.
再见西城 该用户已被删除
7#
发表于 2015-3-6 18:09:03 | 只看该作者
在Dreamweaver里可以很轻松的完成图文混排、插入图片、插入Flash、插入音频、插入视频。
8#
发表于 2015-3-13 07:07:13 | 只看该作者
您在所见即所得网页编辑器进行网页制作和在WORD中进行文本编辑不会感到有什么区别,但它同时也存在着致命的弱点。
您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

QQ|Archiver|手机版|仓酷云 鄂ICP备14007578号-2

GMT+8, 2024-5-3 17:17

Powered by Discuz! X3.2

© 2001-2013 Comsenz Inc.

快速回复 返回顶部 返回列表