day01 - web

字体图标

字体图标的优点：

  • 灵活性：灵活地修改样式，例如：尺寸、颜色等
  • 轻量级：体积小、渲染快、降低服务器请求次数
  • 兼容性：几乎兼容所有主流浏览器
  • 使用方便：
    1. 下载字体包
      图标库 Iconfont：https://www.iconfont.cn
    2. 使用字体图标
      登录（新浪微博） → 选择图标库 → 选择图标，加入购物车 → 购物车 → 添加至项目 → 下载至本地
      3.上传SVG图标
      在阿里矢量图库点击上传按钮→上传SVG图标→找到本地图标SVG文件→去除颜色提交→加入购物车→添加至项目→下载使用

1.使用字体图标 - Unicode编码：

微信截图_20220401201904.png

2.font-calss类名调用

微信截图_20220401202015.png

平面转换

1.位移的基本使用


微信截图_20220401205157.png

2.绝对定位元素居中效果


微信截图_20220401205245.png

  1. 图片双开门案列


    微信截图_20220401205431.png

4.旋转效果


微信截图_20220401205324.png

5.转换原点


微信截图_20220401205539.png

6.多重转换效果


微信截图_20220401205747.png

渐变

微信截图_20220401210030.png
©著作权归作者所有,转载或内容合作请联系作者
平台声明：文章内容（如有图片或视频亦包括在内）由作者上传并发布，文章内容仅代表作者本人观点，简书系信息发布平台，仅提供信息存储服务。

推荐阅读更多精彩内容