首页 星云 工具 资源 星选 资讯 热门工具
:

PDF转图片 完全免费 小红书视频下载 无水印 抖音视频下载 无水印 数字星空

实训作业开发终版.zip

行业研究 1.02MB 23 需要积分: 1
立即下载

资源介绍:

实训作业开发终版.zip
iconfont Demo

  • 手机
    
  • 首页
    
  • 用户
    

Unicode 引用


Unicode 是字体在网页端最原始的应用方式,特点是:

  • 支持按字体的方式去动态调整图标大小,颜色等等。
  • 默认情况下不支持多色,直接添加多色图标会自动去色。

注意:新版 iconfont 支持两种方式引用多色图标:SVG symbol 引用方式和彩色字体图标模式。(使用彩色字体图标需要在「编辑项目」中开启「彩色」选项后并重新生成。)

Unicode 使用步骤如下:

第一步:拷贝项目下面生成的 @font-face

@font-face {
  font-family: 'iconfont';
  src: url('iconfont.woff2?t=1720575129852') format('woff2'),
       url('iconfont.woff?t=1720575129852') format('woff'),
       url('iconfont.ttf?t=1720575129852') format('truetype');
}

第二步:定义使用 iconfont 的样式

.iconfont {
  font-family: "iconfont" !important;
  font-size: 16px;
  font-style: normal;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

第三步:挑选相应图标并获取字体编码,应用于页面

<span class="iconfont">&#x33;</span>

"iconfont" 是你项目下的 font-family。可以通过编辑项目查看,默认是 "iconfont"。

  • 手机
    .icon-shouji
  • 首页
    .icon-shouye
  • 用户
    .icon-yonghu

font-class 引用


font-class 是 Unicode 使用方式的一种变种,主要是解决 Unicode 书写不直观,语意不明确的问题。

与 Unicode 使用方式相比,具有如下特点:

  • 相比于 Unicode 语意明确,书写更直观。可以很容易分辨这个 icon 是什么。
  • 因为使用 class 来定义图标,所以当要替换图标时,只需要修改 class 里面的 Unicode 引用。

使用步骤如下:

第一步:引入项目下面生成的 fontclass 代码:

<link rel="stylesheet" href="./iconfont.css">

第二步:挑选相应图标并获取类名,应用于页面:

<span class="iconfont icon-xxx"></span>

" iconfont" 是你项目下的 font-family。可以通过编辑项目查看,默认是 "iconfont"。

  • 手机
    #icon-shouji
  • 首页
    #icon-shouye
  • 用户
    #icon-yonghu

Symbol 引用


这是一种全新的使用方式,应该说这才是未来的主流,也是平台目前推荐的用法。相关介绍可以参考这篇文章 这种用法其实是做了一个 SVG 的集合,与另�

资源文件列表:

实训作业开发终版.zip 大约有31个文件
  1. 实训作业开发/01作业.html 1.73KB
  2. 实训作业开发/axios.js 136.68KB
  3. 实训作业开发/ceshi.html 1.73KB
  4. 实训作业开发/demo.css 8.23KB
  5. 实训作业开发/demo_index.html 9.49KB
  6. 实训作业开发/echarts.min.js 1005.08KB
  7. 实训作业开发/iconfont.css 559B
  8. 实训作业开发/iconfont.js 5.08KB
  9. 实训作业开发/iconfont.json 584B
  10. 实训作业开发/iconfont.ttf 2.13KB
  11. 实训作业开发/iconfont.woff 1.48KB
  12. 实训作业开发/iconfont.woff2 1.07KB
  13. 实训作业开发/js/
  14. 实训作业开发/js/axios.js 140.75KB
  15. 实训作业开发/js/brand.js 612B
  16. 实训作业开发/js/carData.js 7.33KB
  17. 实训作业开发/js/validate.js 578B
  18. 实训作业开发/js/vue.global.js 560.24KB
  19. 实训作业开发/mian.html 4.97KB
  20. 实训作业开发/styles.css 2.57KB
  21. 实训作业开发/swiper7.4.1/
  22. 实训作业开发/swiper7.4.1/carousel.css 1.64KB
  23. 实训作业开发/swiper7.4.1/swiper-bundle.min.css 17.57KB
  24. 实训作业开发/swiper7.4.1/swiper-bundle.min.js 132.74KB
  25. 实训作业开发/vue.global.js 511.22KB
  26. 实训作业开发/奥迪a.jpg 334.91KB
  27. 实训作业开发/二手车.html 3.25KB
  28. 实训作业开发/卖车.html 1.95KB
  29. 实训作业开发/新车.html 3.31KB
  30. 实训作业开发/页面1.html 4.62KB
  31. 实训作业开发/页面2.html 455B
0评论
提交 加载更多评论
其他资源 笔记111111111111111111
11111111111
BMS-master.zip
BMS-master.zip
MobaXterm远程计算的终极工具
MobaXterm是远程计算的终极工具箱。在一个Windows应用程序中,它提供了大量的功能,这些功能是为程序员、网站管理员、it管理员以及几乎所有需要以更简单的方式处理远程工作的用户量身定制的。MobaXterm在一个开箱即用的可移植exe文件中为Windows桌面提供了所有重要的远程网络工具(SSH、X11、RDP、VNC、FTP、MOSH…)和Unix命令(bash、ls、cat、sed、grep、awk、rsync…)。
mysql-connector-j-8.2.0.jar
JAVA连接数据库所需要的jar包,将该包导入JAVA开发工具IDEA中之后,关注我,后续更新如何通过这个包使用并操作数据库
IDEA使用poi实现数据的XLSX表格的导出导入
IDEA使用poi实现数据的XLSX表格的导出导入
QT纯代码实现滑动开关控件
开关按钮大家应该很熟悉,在设置里面经常遇到,切换时候的滑动效果比较帅气。通常说的开关按钮,有两个状态:on、off。大部分的开关按钮控件,基本上有两大类,第一类是纯代码绘制,这种对代码的掌控度要求比较高,但是灵活性比较好。第二类是贴图,专业的美工做好的各种状态的背景图片,只需要用代码将该图片画到界面上即可。本示例实现纯代码绘制的开关按钮。
工具-文字识别OCR工具
文字识别OCR工具
第二十五组-马毅铎-兰宏程-张嘉伦-潘浩伟-王嘉佟.zip
第二十五组-马毅铎-兰宏程-张嘉伦-潘浩伟-王嘉佟.zip
第二十五组-马毅铎-兰宏程-张嘉伦-潘浩伟-王嘉佟.zip 第二十五组-马毅铎-兰宏程-张嘉伦-潘浩伟-王嘉佟.zip