字体图标
iconfont阿里巴巴矢量图标库
www.iconfont.cn/
一定要注册登录方便项目管理
本地引入
挑选图标加入购物车
添加至项目
去到项目中，点击下载代码
解压压缩包，
更改文件夹的名字为iconfont
放到项目文件夹中
利用font class的方式去引入
在线引入
挑选图标加入购物车
添加至项目
复制在线的链接
link 标签引入在线链接
先设置公共的类名iconfont
再粘贴图标的类名即可
**
fontawesome
icomoon
2d变换.转换 transform
平面坐标系
从左到右是正值
从上到下是正值
反方向为负值
平移
transform: translate(水平, 垂直);
百分比参考自身计算
应用：配合定位实现元素水平垂直居中
旋转
transform: rotate(30deg)
正值顺时针 负值 逆时针
缩放
transform: scale(水平倍数, 垂直倍数)
倍数：0 - 1缩小 大于1 放大
transform: scale(2)
代表水平垂直放大2倍
斜切
transform: skewX(30deg);
transform: skewY(30deg);
应用： 擦亮效果
注意
- 行内元素设置转换无效的
- 如果有多个转换要写到同一个transform里面 并且用空格分隔
transform: translate(100px) rotate(10deg) - 如果同时有旋转和平移属性，最好先写平移，避免先旋转影响坐标系的方位 更改转换原点
transform-origin: 水平 垂直;
方位坐标
left
top
center
right
bottom
具体像素
背景渐变
background-image: linear-gradient(方位, 颜色, 颜色);
方位
to right
从左到右
45deg
从左下到右上
参考时钟
拓展
背景裁切
background-clip
border-box
padding-box
content-box
text
背景只显示在文字的区域
-webkit-background-clip: text
应用：可以配合背景渐变实现渐变色文字
color: transparent;
