1、CSS精灵技术
sprite 减少请求次数
合成一张大图片(精灵图,雪剪图)
处理网页背景图像的方式
2、字体图标
iconfont UI.svg(UI提供) 可以无限放大
1)上传字体包
国外:http://icomoon.io
阿里:http://www.iconfont.cn/
2)告诉别人我们生成的文字图标
@font-face{} 声明字体,电脑里没有
3)使用引用
font-family:"iconmoon" 自定义
html 找 复制
标签::before{content:"\eqq0"}
4)追加新图标
导入.json 重新下载
3、滑动门技术
背景自由拉伸适应文字多少
用到CSS精灵.padding 撑开
<li>
<a> <span> </span>
</a>
</li>
span 不给宽度 用padding
4、其他一些小技巧
鼠标样式 style = "cursor: default ""
- default 小白
- poniter 小手
- move 移动
- text 文本
取消轮廓线 outline:0
防止拖拽文本 resize:none
垂直对齐 vertical:align
去除图片底侧有空隙 display:block vertical-align:top/middle
溢出文字隐藏 word-break 自动换行
网友评论