图片整合
作者:互联网
精灵图 雪碧图 css sprite css精灵
优点:
1、降低服务端的压力,减少请求次数
2、降低图片质量,提高还在速度
图片整合的规则
1、一定要是小图标
2、整合的图片背景色必须透明png/gif
3、里面的小图标尽量上下排列 每个小图标根据需求留出足够的空间
background-position:-100px 0;上下 左右
浏览器内核(核心源码)
Trident ie浏览器
gecko 火狐
webkit 谷歌/苹果
Blink 欧鹏/谷歌
为什么会出现浏览器兼容问题?因为浏览器内核不同!
BUG 出现的问题/漏洞
HACK解决BUG方法
FILTER过滤器(可以针对每款浏览器设置样式)
1、
bug:表单元素对齐方式不一致
hack:添加浮动
2、
bug:按钮大小不一致
hack:
1,如果是input外层包裹一个元素把大小都给外层元素添加
2,如果按钮是一张图片切图当背景即可
3,没有在表单内部按钮,用a模拟即可
3、
bug:鼠标指针不能识别cursor:hand;
hack:cursor:pointer;
cursor属性值们:
move 移动
help 变成一个问号
text 文本
wait 等待
crosshair 加号
progress 过程
ne-resize 向上或向右移动
pointer 手形
inherit 继承
4、
bug:透明度 opacity属性 ie不能识别opacity
hack:opacity:0.5; filter-alpha(opacity=50)
alpha里面的opacity接收0-100的数字
<meta name="keywords" content=""/>主要关键字
<meta anme="description" content=""/>主要内容
回流(resflow)与重绘(repaint)
注:每个页面至少发生一次回流 相对减少回流提高性能
标签:opacity,浏览器,小图标,cursor,整合,hack,bug,图片 来源: https://www.cnblogs.com/ht955/p/13871856.html