diff --git a/src/renderer/src/assets/iconfont/demo.css b/src/renderer/src/assets/iconfont/demo.css deleted file mode 100644 index a67054a..0000000 --- a/src/renderer/src/assets/iconfont/demo.css +++ /dev/null @@ -1,539 +0,0 @@ -/* Logo 字体 */ -@font-face { - font-family: "iconfont logo"; - src: url('https://at.alicdn.com/t/font_985780_km7mi63cihi.eot?t=1545807318834'); - src: url('https://at.alicdn.com/t/font_985780_km7mi63cihi.eot?t=1545807318834#iefix') format('embedded-opentype'), - url('https://at.alicdn.com/t/font_985780_km7mi63cihi.woff?t=1545807318834') format('woff'), - url('https://at.alicdn.com/t/font_985780_km7mi63cihi.ttf?t=1545807318834') format('truetype'), - url('https://at.alicdn.com/t/font_985780_km7mi63cihi.svg?t=1545807318834#iconfont') format('svg'); -} - -.logo { - font-family: "iconfont logo"; - font-size: 160px; - font-style: normal; - -webkit-font-smoothing: antialiased; - -moz-osx-font-smoothing: grayscale; -} - -/* tabs */ -.nav-tabs { - position: relative; -} - -.nav-tabs .nav-more { - position: absolute; - right: 0; - bottom: 0; - height: 42px; - line-height: 42px; - color: #666; -} - -#tabs { - border-bottom: 1px solid #eee; -} - -#tabs li { - cursor: pointer; - width: 100px; - height: 40px; - line-height: 40px; - text-align: center; - font-size: 16px; - border-bottom: 2px solid transparent; - position: relative; - z-index: 1; - margin-bottom: -1px; - color: #666; -} - - -#tabs .active { - border-bottom-color: #f00; - color: #222; -} - -.tab-container .content { - display: none; -} - -/* 页面布局 */ -.main { - padding: 30px 100px; - width: 960px; - margin: 0 auto; -} - -.main .logo { - color: #333; - text-align: left; - margin-bottom: 30px; - line-height: 1; - height: 110px; - margin-top: -50px; - overflow: hidden; - *zoom: 1; -} - -.main .logo a { - font-size: 160px; - color: #333; -} - -.helps { - margin-top: 40px; -} - -.helps pre { - padding: 20px; - margin: 10px 0; - border: solid 1px #e7e1cd; - background-color: #fffdef; - overflow: auto; -} - -.icon_lists { - width: 100% !important; - overflow: hidden; - *zoom: 1; -} - -.icon_lists li { - width: 100px; - margin-bottom: 10px; - margin-right: 20px; - text-align: center; - list-style: none !important; - cursor: default; -} - -.icon_lists li .code-name { - line-height: 1.2; -} - -.icon_lists .icon { - display: block; - height: 100px; - line-height: 100px; - font-size: 42px; - margin: 10px auto; - color: #333; - -webkit-transition: font-size 0.25s linear, width 0.25s linear; - -moz-transition: font-size 0.25s linear, width 0.25s linear; - transition: font-size 0.25s linear, width 0.25s linear; -} - -.icon_lists .icon:hover { - font-size: 100px; -} - -.icon_lists .svg-icon { - /* 通过设置 font-size 来改变图标大小 */ - width: 1em; - /* 图标和文字相邻时,垂直对齐 */ - vertical-align: -0.15em; - /* 通过设置 color 来改变 SVG 的颜色/fill */ - fill: currentColor; - /* path 和 stroke 溢出 viewBox 部分在 IE 下会显示 - normalize.css 中也包含这行 */ - overflow: hidden; -} - -.icon_lists li .name, -.icon_lists li .code-name { - color: #666; -} - -/* markdown 样式 */ -.markdown { - color: #666; - font-size: 14px; - line-height: 1.8; -} - -.highlight { - line-height: 1.5; -} - -.markdown img { - vertical-align: middle; - max-width: 100%; -} - -.markdown h1 { - color: #404040; - font-weight: 500; - line-height: 40px; - margin-bottom: 24px; -} - -.markdown h2, -.markdown h3, -.markdown h4, -.markdown h5, -.markdown h6 { - color: #404040; - margin: 1.6em 0 0.6em 0; - font-weight: 500; - clear: both; -} - -.markdown h1 { - font-size: 28px; -} - -.markdown h2 { - font-size: 22px; -} - -.markdown h3 { - font-size: 16px; -} - -.markdown h4 { - font-size: 14px; -} - -.markdown h5 { - font-size: 12px; -} - -.markdown h6 { - font-size: 12px; -} - -.markdown hr { - height: 1px; - border: 0; - background: #e9e9e9; - margin: 16px 0; - clear: both; -} - -.markdown p { - margin: 1em 0; -} - -.markdown>p, -.markdown>blockquote, -.markdown>.highlight, -.markdown>ol, -.markdown>ul { - width: 80%; -} - -.markdown ul>li { - list-style: circle; -} - -.markdown>ul li, -.markdown blockquote ul>li { - margin-left: 20px; - padding-left: 4px; -} - -.markdown>ul li p, -.markdown>ol li p { - margin: 0.6em 0; -} - -.markdown ol>li { - list-style: decimal; -} - -.markdown>ol li, -.markdown blockquote ol>li { - margin-left: 20px; - padding-left: 4px; -} - -.markdown code { - margin: 0 3px; - padding: 0 5px; - background: #eee; - border-radius: 3px; -} - -.markdown strong, -.markdown b { - font-weight: 600; -} - -.markdown>table { - border-collapse: collapse; - border-spacing: 0px; - empty-cells: show; - border: 1px solid #e9e9e9; - width: 95%; - margin-bottom: 24px; -} - -.markdown>table th { - white-space: nowrap; - color: #333; - font-weight: 600; -} - -.markdown>table th, -.markdown>table td { - border: 1px solid #e9e9e9; - padding: 8px 16px; - text-align: left; -} - -.markdown>table th { - background: #F7F7F7; -} - -.markdown blockquote { - font-size: 90%; - color: #999; - border-left: 4px solid #e9e9e9; - padding-left: 0.8em; - margin: 1em 0; -} - -.markdown blockquote p { - margin: 0; -} - -.markdown .anchor { - opacity: 0; - transition: opacity 0.3s ease; - margin-left: 8px; -} - -.markdown .waiting { - color: #ccc; -} - -.markdown h1:hover .anchor, -.markdown h2:hover .anchor, -.markdown h3:hover .anchor, -.markdown h4:hover .anchor, -.markdown h5:hover .anchor, -.markdown h6:hover .anchor { - opacity: 1; - display: inline-block; -} - -.markdown>br, -.markdown>p>br { - clear: both; -} - - -.hljs { - display: block; - background: white; - padding: 0.5em; - color: #333333; - overflow-x: auto; -} - -.hljs-comment, -.hljs-meta { - color: #969896; -} - -.hljs-string, -.hljs-variable, -.hljs-template-variable, -.hljs-strong, -.hljs-emphasis, -.hljs-quote { - color: #df5000; -} - -.hljs-keyword, -.hljs-selector-tag, -.hljs-type { - color: #a71d5d; -} - -.hljs-literal, -.hljs-symbol, -.hljs-bullet, -.hljs-attribute { - color: #0086b3; -} - -.hljs-section, -.hljs-name { - color: #63a35c; -} - -.hljs-tag { - color: #333333; -} - -.hljs-title, -.hljs-attr, -.hljs-selector-id, -.hljs-selector-class, -.hljs-selector-attr, -.hljs-selector-pseudo { - color: #795da3; -} - -.hljs-addition { - color: #55a532; - background-color: #eaffea; -} - -.hljs-deletion { - color: #bd2c00; - background-color: #ffecec; -} - -.hljs-link { - text-decoration: underline; -} - -/* 代码高亮 */ -/* PrismJS 1.15.0 -https://prismjs.com/download.html#themes=prism&languages=markup+css+clike+javascript */ -/** - * prism.js default theme for JavaScript, CSS and HTML - * Based on dabblet (http://dabblet.com) - * @author Lea Verou - */ -code[class*="language-"], -pre[class*="language-"] { - color: black; - background: none; - text-shadow: 0 1px white; - font-family: Consolas, Monaco, 'Andale Mono', 'Ubuntu Mono', monospace; - text-align: left; - white-space: pre; - word-spacing: normal; - word-break: normal; - word-wrap: normal; - line-height: 1.5; - - -moz-tab-size: 4; - -o-tab-size: 4; - tab-size: 4; - - -webkit-hyphens: none; - -moz-hyphens: none; - -ms-hyphens: none; - hyphens: none; -} - -pre[class*="language-"]::-moz-selection, -pre[class*="language-"] ::-moz-selection, -code[class*="language-"]::-moz-selection, -code[class*="language-"] ::-moz-selection { - text-shadow: none; - background: #b3d4fc; -} - -pre[class*="language-"]::selection, -pre[class*="language-"] ::selection, -code[class*="language-"]::selection, -code[class*="language-"] ::selection { - text-shadow: none; - background: #b3d4fc; -} - -@media print { - - code[class*="language-"], - pre[class*="language-"] { - text-shadow: none; - } -} - -/* Code blocks */ -pre[class*="language-"] { - padding: 1em; - margin: .5em 0; - overflow: auto; -} - -:not(pre)>code[class*="language-"], -pre[class*="language-"] { - background: #f5f2f0; -} - -/* Inline code */ -:not(pre)>code[class*="language-"] { - padding: .1em; - border-radius: .3em; - white-space: normal; -} - -.token.comment, -.token.prolog, -.token.doctype, -.token.cdata { - color: slategray; -} - -.token.punctuation { - color: #999; -} - -.namespace { - opacity: .7; -} - -.token.property, -.token.tag, -.token.boolean, -.token.number, -.token.constant, -.token.symbol, -.token.deleted { - color: #905; -} - -.token.selector, -.token.attr-name, -.token.string, -.token.char, -.token.builtin, -.token.inserted { - color: #690; -} - -.token.operator, -.token.entity, -.token.url, -.language-css .token.string, -.style .token.string { - color: #9a6e3a; - background: hsla(0, 0%, 100%, .5); -} - -.token.atrule, -.token.attr-value, -.token.keyword { - color: #07a; -} - -.token.function, -.token.class-name { - color: #DD4A68; -} - -.token.regex, -.token.important, -.token.variable { - color: #e90; -} - -.token.important, -.token.bold { - font-weight: bold; -} - -.token.italic { - font-style: italic; -} - -.token.entity { - cursor: help; -} diff --git a/src/renderer/src/assets/iconfont/demo_index.html b/src/renderer/src/assets/iconfont/demo_index.html deleted file mode 100644 index 2d28214..0000000 --- a/src/renderer/src/assets/iconfont/demo_index.html +++ /dev/null @@ -1,3961 +0,0 @@ - - - - - iconfont Demo - - - - - - - - - - - - - -
-

- - -

- -
-
-
    - -
  • - -
    教材
    -
    
    -
  • - -
  • - -
    -
    
    -
  • - -
  • - -
    教材选择
    -
    
    -
  • - -
  • - -
    组织框架
    -
    
    -
  • - -
  • - -
    教材
    -
    
    -
  • - -
  • - -
    在线考试
    -
    
    -
  • - -
  • - -
    目标绘制
    -
    
    -
  • - -
  • - -
    图谱数据源
    -
    
    -
  • - -
  • - -
    目标
    -
    
    -
  • - -
  • - -
    知识图谱
    -
    
    -
  • - -
  • - -
    图谱
    -
    
    -
  • - -
  • - -
    中文文献
    -
    
    -
  • - -
  • - -
    图谱
    -
    
    -
  • - -
  • - -
    框架
    -
    
    -
  • - -
  • - -
    文献
    -
    
    -
  • - -
  • - -
    122-图谱
    -
    
    -
  • - -
  • - -
    图谱
    -
    
    -
  • - -
  • - -
    图谱
    -
    
    -
  • - -
  • - -
    组织框架
    -
    
    -
  • - -
  • - -
    图谱
    -
    
    -
  • - -
  • - -
    考试 (1)
    -
    
    -
  • - -
  • - -
    反馈
    -
    
    -
  • - -
  • - -
    题库
    -
    
    -
  • - -
  • - -
    ldc-position
    -
    
    -
  • - -
  • - -
    素材
    -
    
    -
  • - -
  • - -
    朋友
    -
    
    -
  • - -
  • - -
    作业
    -
    
    -
  • - -
  • - -
    教学分析
    -
    
    -
  • - -
  • - -
    文件夹
    -
    
    -
  • - -
  • - -
    教学研修
    -
    
    -
  • - -
  • - -
    教学设计
    -
    
    -
  • - -
  • - -
    专业资源库
    -
    
    -
  • - -
  • - -
    朋友圈
    -
    
    -
  • - -
  • - -
    当前会话
    -
    
    -
  • - -
  • - -
    研究室
    -
    
    -
  • - -
  • - -
    工作台
    -
    
    -
  • - -
  • - -
    论文
    -
    
    -
  • - -
  • - -
    德诚_线上学习001
    -
    
    -
  • - -
  • - -
    集体备课
    -
    
    -
  • - -
  • - -
    课题
    -
    
    -
  • - -
  • - -
    朋友圈
    -
    
    -
  • - -
  • - -
    备课
    -
    
    -
  • - -
  • - -
    share
    -
    
    -
  • - -
  • - -
    227注册、添加好友
    -
    
    -
  • - -
  • - -
    场景灵活
    -
    
    -
  • - -
  • - -
    业务开展
    -
    
    -
  • - -
  • - -
    反馈
    -
    
    -
  • - -
  • - -
    设置
    -
    
    -
  • - -
  • - -
    查阅
    -
    
    -
  • - -
  • - -
    报告
    -
    
    -
  • - -
  • - -
    学科组合
    -
    
    -
  • - -
  • - -
    分享
    -
    
    -
  • - -
  • - -
    通知中心
    -
    
    -
  • - -
  • - -
    下架
    -
    
    -
  • - -
  • - -
    生产过程管理
    -
    
    -
  • - -
  • - -
    课件
    -
    
    -
  • - -
  • - -
    浏览
    -
    
    -
  • - -
  • - -
    发表
    -
    
    -
  • - -
  • - -
    课程
    -
    
    -
  • - -
  • - -
    编辑
    -
    
    -
  • - -
  • - -
    评价
    -
    
    -
  • - -
  • - -
    综合诊断
    -
    
    -
  • - -
  • - -
    班级
    -
    
    -
  • - -
  • - -
    投诉与建议
    -
    
    -
  • - -
  • - -
    交流
    -
    
    -
  • - -
  • - -
    评议
    -
    
    -
  • - -
  • - -
    学情分析
    -
    
    -
  • - -
  • - -
    check
    -
    
    -
  • - -
  • - -
    upload
    -
    
    -
  • - -
  • - -
    讨论
    -
    
    -
  • - -
  • - -
    途径
    -
    
    -
  • - -
  • - -
    咨询
    -
    
    -
  • - -
  • - -
    浏览
    -
    
    -
  • - -
  • - -
    要素
    -
    
    -
  • - -
  • - -
    报告
    -
    
    -
  • - -
  • - -
    收藏
    -
    
    -
  • - -
  • - -
    审核
    -
    
    -
  • - -
  • - -
    w_多选题
    -
    
    -
  • - -
  • - -
    分析
    -
    
    -
  • - -
  • - -
    kanshu
    -
    
    -
  • - -
  • - -
    上传
    -
    
    -
  • - -
  • - -
    检查
    -
    
    -
  • - -
  • - -
    群组
    -
    
    -
  • - -
  • - -
    作品
    -
    
    -
  • - -
  • - -
    数译_教学管理
    -
    
    -
  • - -
  • - -
    liangsuan
    -
    
    -
  • - -
  • - -
    business-report
    -
    
    -
  • - -
  • - -
    项目评审
    -
    
    -
  • - -
  • - -
    项目申报
    -
    
    -
  • - -
  • - -
    下架
    -
    
    -
  • - -
  • - -
    分享 2
    -
    
    -
  • - -
  • - -
    考试分析
    -
    
    -
  • - -
  • - -
    课堂实录 1
    -
    
    -
  • - -
  • - -
    图标_模式类型配置
    -
    
    -
  • - -
  • - -
    写作-copy
    -
    
    -
  • - -
  • - -
    布置-copy
    -
    
    -
  • - -
  • - -
    资源分析
    -
    
    -
  • - -
  • - -
    收藏
    -
    
    -
  • - -
  • - -
    题目数量
    -
    
    -
  • - -
  • - -
    PPT
    -
    
    -
  • - -
  • - -
    发表论文
    -
    
    -
  • - -
  • - -
    写作
    -
    
    -
  • - -
  • - -
    粮食动态决策分析系统
    -
    
    -
  • - -
  • - -
    课程资源
    -
    
    -
  • - -
  • - -
    作业平台
    -
    
    -
  • - -
  • - -
    结课标准-笔记数
    -
    
    -
  • - -
  • - -
    勋章
    -
    
    -
  • - -
  • - -
    教材征订
    -
    
    -
  • - -
  • - -
    新增模型
    -
    
    -
  • - -
  • - -
    表彰勋章英雄
    -
    
    -
  • - -
  • - -
    勋章
    -
    
    -
  • - -
  • - -
    237拍照-线性
    -
    
    -
  • - -
  • - -
    主页未选
    -
    
    -
  • - -
  • - -
    作业
    -
    
    -
  • - -
  • - -
    更多
    -
    
    -
  • - -
  • - -
    互动
    -
    
    -
  • - -
  • - -
    橡皮擦
    -
    
    -
  • - -
  • - -
    更多
    -
    
    -
  • - -
  • - -
    聚焦
    -
    
    -
  • - -
  • - -
    画笔
    -
    
    -
  • - -
  • - -
    28D鼠标箭头-copy
    -
    
    -
  • - -
  • - -
    下一页
    -
    
    -
  • - -
  • - -
    上一页
    -
    
    -
  • - -
  • - -
    双页
    -
    
    -
  • - -
  • - -
    单页模板
    -
    
    -
  • - -
  • - -
    铃铛
    -
    
    -
  • - -
  • - -
    移动到组
    -
    
    -
  • - -
  • - -
    删除
    -
    
    -
  • - -
  • - -
    下载
    -
    
    -
  • - -
  • - -
    编辑
    -
    
    -
  • - -
  • - -
    云文件-
    -
    
    -
  • - -
  • - -
    avi
    -
    
    -
  • - -
  • - -
    access
    -
    
    -
  • - -
  • - -
    docx
    -
    
    -
  • - -
  • - -
    folder
    -
    
    -
  • - -
  • - -
    excel
    -
    
    -
  • - -
  • - -
    gif
    -
    
    -
  • - -
  • - -
    jpeg
    -
    
    -
  • - -
  • - -
    jpg
    -
    
    -
  • - -
  • - -
    mp3
    -
    
    -
  • - -
  • - -
    mov
    -
    
    -
  • - -
  • - -
    pdf
    -
    
    -
  • - -
  • - -
    ppt
    -
    
    -
  • - -
  • - -
    papers
    -
    
    -
  • - -
  • - -
    pptx
    -
    
    -
  • - -
  • - -
    psd
    -
    
    -
  • - -
  • - -
    rar
    -
    
    -
  • - -
  • - -
    txt
    -
    
    -
  • - -
  • - -
    zip
    -
    
    -
  • - -
  • - -
    video
    -
    
    -
  • - -
  • - -
    xlsx
    -
    
    -
  • - -
  • - -
    png
    -
    
    -
  • - -
  • - -
    word
    -
    
    -
  • - -
  • - -
    省略号
    -
    
    -
  • - -
  • - -
    加号
    -
    
    -
  • - -
  • - -
    关闭
    -
    
    -
  • - -
  • - -
    向右
    -
    
    -
  • - -
  • - -
    讲课
    -
    
    -
  • - -
  • - -
    教学资源
    -
    
    -
  • - -
  • - -
    备课
    -
    
    -
  • - -
  • - -
    最大化
    -
    
    -
  • - -
  • - -
    窗口-最大化_line
    -
    
    -
  • - -
  • - -
    最小化
    -
    
    -
  • - -
  • - -
    关闭
    -
    
    -
  • - -
-
-

Unicode 引用

-
- -

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

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

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

-
-

Unicode 使用步骤如下:

-

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

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

第二步:定义使用 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-icon -
    -
  • - -
  • - -
    - 课 -
    -
    .icon-ke -
    -
  • - -
  • - -
    - 教材选择 -
    -
    .icon-jiaocaixuanze -
    -
  • - -
  • - -
    - 组织框架 -
    -
    .icon-organization-framework-line -
    -
  • - -
  • - -
    - 教材 -
    -
    .icon-jiaocai -
    -
  • - -
  • - -
    - 在线考试 -
    -
    .icon-zaixiankaoshi -
    -
  • - -
  • - -
    - 目标绘制 -
    -
    .icon-mubiaohuizhi -
    -
  • - -
  • - -
    - 图谱数据源 -
    -
    .icon-tupushujuyuan -
    -
  • - -
  • - -
    - 目标 -
    -
    .icon-mubiao -
    -
  • - -
  • - -
    - 知识图谱 -
    -
    .icon-zhishitupu -
    -
  • - -
  • - -
    - 图谱 -
    -
    .icon-tupu -
    -
  • - -
  • - -
    - 中文文献 -
    -
    .icon-zhongwenwenxian -
    -
  • - -
  • - -
    - 图谱 -
    -
    .icon-tupu1 -
    -
  • - -
  • - -
    - 框架 -
    -
    .icon-kuangjia -
    -
  • - -
  • - -
    - 文献 -
    -
    .icon-wenxian -
    -
  • - -
  • - -
    - 122-图谱 -
    -
    .icon-tupu-01 -
    -
  • - -
  • - -
    - 图谱 -
    -
    .icon-tupu2 -
    -
  • - -
  • - -
    - 图谱 -
    -
    .icon-tupu3 -
    -
  • - -
  • - -
    - 组织框架 -
    -
    .icon-zuzhikuangjia -
    -
  • - -
  • - -
    - 图谱 -
    -
    .icon-tupu4 -
    -
  • - -
  • - -
    - 考试 (1) -
    -
    .icon-a-kaoshi1 -
    -
  • - -
  • - -
    - 反馈 -
    -
    .icon-fankui -
    -
  • - -
  • - -
    - 题库 -
    -
    .icon-tiku -
    -
  • - -
  • - -
    - ldc-position -
    -
    .icon-ldc-position -
    -
  • - -
  • - -
    - 素材 -
    -
    .icon-sucai -
    -
  • - -
  • - -
    - 朋友 -
    -
    .icon-pengyou -
    -
  • - -
  • - -
    - 作业 -
    -
    .icon-zuoye -
    -
  • - -
  • - -
    - 教学分析 -
    -
    .icon-jiaoxuefenxi -
    -
  • - -
  • - -
    - 文件夹 -
    -
    .icon-wenjianjia -
    -
  • - -
  • - -
    - 教学研修 -
    -
    .icon-jiaoxueyanxiu -
    -
  • - -
  • - -
    - 教学设计 -
    -
    .icon-jiaoxuesheji -
    -
  • - -
  • - -
    - 专业资源库 -
    -
    .icon-zhuanyeziyuanku -
    -
  • - -
  • - -
    - 朋友圈 -
    -
    .icon-pengyouquan -
    -
  • - -
  • - -
    - 当前会话 -
    -
    .icon-dangqianhuihua -
    -
  • - -
  • - -
    - 研究室 -
    -
    .icon-yanjiushi -
    -
  • - -
  • - -
    - 工作台 -
    -
    .icon-gongzuotai -
    -
  • - -
  • - -
    - 论文 -
    -
    .icon-lunwen -
    -
  • - -
  • - -
    - 德诚_线上学习001 -
    -
    .icon-decheng_xianshangxuexi -
    -
  • - -
  • - -
    - 集体备课 -
    -
    .icon-jitibeike- -
    -
  • - -
  • - -
    - 课题 -
    -
    .icon-keti -
    -
  • - -
  • - -
    - 朋友圈 -
    -
    .icon-pengyouquan1 -
    -
  • - -
  • - -
    - 备课 -
    -
    .icon-beike1 -
    -
  • - -
  • - -
    - share -
    -
    .icon-fenxiang -
    -
  • - -
  • - -
    - 227注册、添加好友 -
    -
    .icon-zhucetianjiahaoyou -
    -
  • - -
  • - -
    - 场景灵活 -
    -
    .icon-duoqudaojicheng -
    -
  • - -
  • - -
    - 业务开展 -
    -
    .icon-yewukaizhan -
    -
  • - -
  • - -
    - 反馈 -
    -
    .icon-fankui1 -
    -
  • - -
  • - -
    - 设置 -
    -
    .icon-shezhi -
    -
  • - -
  • - -
    - 查阅 -
    -
    .icon-chayue -
    -
  • - -
  • - -
    - 报告 -
    -
    .icon-baogao -
    -
  • - -
  • - -
    - 学科组合 -
    -
    .icon-xuekezuhe -
    -
  • - -
  • - -
    - 分享 -
    -
    .icon-fenxiang1 -
    -
  • - -
  • - -
    - 通知中心 -
    -
    .icon-tongzhizhongxin -
    -
  • - -
  • - -
    - 下架 -
    -
    .icon-xiajia -
    -
  • - -
  • - -
    - 生产过程管理 -
    -
    .icon-shengchanguochengguanli -
    -
  • - -
  • - -
    - 课件 -
    -
    .icon-kejian -
    -
  • - -
  • - -
    - 浏览 -
    -
    .icon-liulan -
    -
  • - -
  • - -
    - 发表 -
    -
    .icon-fabiao -
    -
  • - -
  • - -
    - 课程 -
    -
    .icon-kecheng -
    -
  • - -
  • - -
    - 编辑 -
    -
    .icon-bianji1 -
    -
  • - -
  • - -
    - 评价 -
    -
    .icon-pingjia -
    -
  • - -
  • - -
    - 综合诊断 -
    -
    .icon-zonghezhenduan -
    -
  • - -
  • - -
    - 班级 -
    -
    .icon-banji -
    -
  • - -
  • - -
    - 投诉与建议 -
    -
    .icon-tousuyujianyi -
    -
  • - -
  • - -
    - 交流 -
    -
    .icon-jiaoliu -
    -
  • - -
  • - -
    - 评议 -
    -
    .icon-pingyi -
    -
  • - -
  • - -
    - 学情分析 -
    -
    .icon-xueqingfenxi -
    -
  • - -
  • - -
    - check -
    -
    .icon-check -
    -
  • - -
  • - -
    - upload -
    -
    .icon-upload -
    -
  • - -
  • - -
    - 讨论 -
    -
    .icon-taolun -
    -
  • - -
  • - -
    - 途径 -
    -
    .icon-tujing -
    -
  • - -
  • - -
    - 咨询 -
    -
    .icon-zixun -
    -
  • - -
  • - -
    - 浏览 -
    -
    .icon-liulan1 -
    -
  • - -
  • - -
    - 要素 -
    -
    .icon-yaosu -
    -
  • - -
  • - -
    - 报告 -
    -
    .icon-baogao1 -
    -
  • - -
  • - -
    - 收藏 -
    -
    .icon-shoucang -
    -
  • - -
  • - -
    - 审核 -
    -
    .icon-shenhe -
    -
  • - -
  • - -
    - w_多选题 -
    -
    .icon-w_duoxuanti -
    -
  • - -
  • - -
    - 分析 -
    -
    .icon-fenxi -
    -
  • - -
  • - -
    - kanshu -
    -
    .icon-kanshu -
    -
  • - -
  • - -
    - 上传 -
    -
    .icon-qwe -
    -
  • - -
  • - -
    - 检查 -
    -
    .icon-jiancha -
    -
  • - -
  • - -
    - 群组 -
    -
    .icon-qunzu -
    -
  • - -
  • - -
    - 作品 -
    -
    .icon-zuopin -
    -
  • - -
  • - -
    - 数译_教学管理 -
    -
    .icon-shuyi_jiaoxueguanli -
    -
  • - -
  • - -
    - liangsuan -
    -
    .icon-liangsuan -
    -
  • - -
  • - -
    - business-report -
    -
    .icon-business-report -
    -
  • - -
  • - -
    - 项目评审 -
    -
    .icon-xiangmupingshen -
    -
  • - -
  • - -
    - 项目申报 -
    -
    .icon-xiangmushenbao -
    -
  • - -
  • - -
    - 下架 -
    -
    .icon-xiajia1 -
    -
  • - -
  • - -
    - 分享 2 -
    -
    .icon-a-fenxiang2 -
    -
  • - -
  • - -
    - 考试分析 -
    -
    .icon-icon_kaoshifenxi -
    -
  • - -
  • - -
    - 课堂实录 1 -
    -
    .icon-a-ketangshilu1 -
    -
  • - -
  • - -
    - 图标_模式类型配置 -
    -
    .icon-tubiao_moshileixingpeizhi -
    -
  • - -
  • - -
    - 写作-copy -
    -
    .icon-xiezuo -
    -
  • - -
  • - -
    - 布置-copy -
    -
    .icon-buzhi -
    -
  • - -
  • - -
    - 资源分析 -
    -
    .icon-ziyuanfenxi -
    -
  • - -
  • - -
    - 收藏 -
    -
    .icon-shoucang1 -
    -
  • - -
  • - -
    - 题目数量 -
    -
    .icon-iconku-zhuanqu- -
    -
  • - -
  • - -
    - PPT -
    -
    .icon-PPT -
    -
  • - -
  • - -
    - 发表论文 -
    -
    .icon-fabiaolunwen -
    -
  • - -
  • - -
    - 写作 -
    -
    .icon-xiezuo1 -
    -
  • - -
  • - -
    - 粮食动态决策分析系统 -
    -
    .icon-fenxi1 -
    -
  • - -
  • - -
    - 课程资源 -
    -
    .icon-kechengziyuan -
    -
  • - -
  • - -
    - 作业平台 -
    -
    .icon-36zuoyepingtai -
    -
  • - -
  • - -
    - 结课标准-笔记数 -
    -
    .icon-jiekebiaozhunbijishu -
    -
  • - -
  • - -
    - 勋章 -
    -
    .icon-xunzhang -
    -
  • - -
  • - -
    - 教材征订 -
    -
    .icon-jiaocaizhengding -
    -
  • - -
  • - -
    - 新增模型 -
    -
    .icon-xinzengmoxing -
    -
  • - -
  • - -
    - 表彰勋章英雄 -
    -
    .icon-a-biaozhangxunzhangyingxiong -
    -
  • - -
  • - -
    - 勋章 -
    -
    .icon-xunzhang1 -
    -
  • - -
  • - -
    - 237拍照-线性 -
    -
    .icon-paizhao-xianxing -
    -
  • - -
  • - -
    - 主页未选 -
    -
    .icon-zhuye2 -
    -
  • - -
  • - -
    - 作业 -
    -
    .icon-zuoye1 -
    -
  • - -
  • - -
    - 更多 -
    -
    .icon-xiazai9 -
    -
  • - -
  • - -
    - 互动 -
    -
    .icon-hudong -
    -
  • - -
  • - -
    - 橡皮擦 -
    -
    .icon-xiangpica -
    -
  • - -
  • - -
    - 更多 -
    -
    .icon-gengduo -
    -
  • - -
  • - -
    - 聚焦 -
    -
    .icon-jujiao -
    -
  • - -
  • - -
    - 画笔 -
    -
    .icon-huabi -
    -
  • - -
  • - -
    - 28D鼠标箭头-copy -
    -
    .icon-mouse -
    -
  • - -
  • - -
    - 下一页 -
    -
    .icon-xiayiye -
    -
  • - -
  • - -
    - 上一页 -
    -
    .icon-shangyiye -
    -
  • - -
  • - -
    - 双页 -
    -
    .icon-shuangye -
    -
  • - -
  • - -
    - 单页模板 -
    -
    .icon-danyemoban -
    -
  • - -
  • - -
    - 铃铛 -
    -
    .icon-lingdang -
    -
  • - -
  • - -
    - 移动到组 -
    -
    .icon-yidongdaozu -
    -
  • - -
  • - -
    - 删除 -
    -
    .icon-shanchu -
    -
  • - -
  • - -
    - 下载 -
    -
    .icon-xiazai -
    -
  • - -
  • - -
    - 编辑 -
    -
    .icon-bianji -
    -
  • - -
  • - -
    - 云文件- -
    -
    .icon-yunwenjian- -
    -
  • - -
  • - -
    - avi -
    -
    .icon-avi -
    -
  • - -
  • - -
    - access -
    -
    .icon-access -
    -
  • - -
  • - -
    - docx -
    -
    .icon-docx -
    -
  • - -
  • - -
    - folder -
    -
    .icon-folder -
    -
  • - -
  • - -
    - excel -
    -
    .icon-excel -
    -
  • - -
  • - -
    - gif -
    -
    .icon-gif -
    -
  • - -
  • - -
    - jpeg -
    -
    .icon-jpeg -
    -
  • - -
  • - -
    - jpg -
    -
    .icon-jpg -
    -
  • - -
  • - -
    - mp3 -
    -
    .icon-mp -
    -
  • - -
  • - -
    - mov -
    -
    .icon-mov -
    -
  • - -
  • - -
    - pdf -
    -
    .icon-pdf -
    -
  • - -
  • - -
    - ppt -
    -
    .icon-ppt -
    -
  • - -
  • - -
    - papers -
    -
    .icon-papers -
    -
  • - -
  • - -
    - pptx -
    -
    .icon-pptx -
    -
  • - -
  • - -
    - psd -
    -
    .icon-psd -
    -
  • - -
  • - -
    - rar -
    -
    .icon-rar -
    -
  • - -
  • - -
    - txt -
    -
    .icon-txt -
    -
  • - -
  • - -
    - zip -
    -
    .icon-zip -
    -
  • - -
  • - -
    - video -
    -
    .icon-video -
    -
  • - -
  • - -
    - xlsx -
    -
    .icon-xlsx -
    -
  • - -
  • - -
    - png -
    -
    .icon-png -
    -
  • - -
  • - -
    - word -
    -
    .icon-word -
    -
  • - -
  • - -
    - 省略号 -
    -
    .icon-shenglvehao -
    -
  • - -
  • - -
    - 加号 -
    -
    .icon-jiahao -
    -
  • - -
  • - -
    - 关闭 -
    -
    .icon-guanbi -
    -
  • - -
  • - -
    - 向右 -
    -
    .icon-xiangyou -
    -
  • - -
  • - -
    - 讲课 -
    -
    .icon-jiangke1 -
    -
  • - -
  • - -
    - 教学资源 -
    -
    .icon-jiaoxueziyuan -
    -
  • - -
  • - -
    - 备课 -
    -
    .icon-beike -
    -
  • - -
  • - -
    - 最大化 -
    -
    .icon-zuidahua -
    -
  • - -
  • - -
    - 窗口-最大化_line -
    -
    .icon-window-max_line -
    -
  • - -
  • - -
    - 最小化 -
    -
    .icon-zuixiaohua -
    -
  • - -
  • - -
    - 关闭 -
    -
    .icon-close -
    -
  • - -
-
-

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-icon
    -
  • - -
  • - -
    -
    #icon-ke
    -
  • - -
  • - -
    教材选择
    -
    #icon-jiaocaixuanze
    -
  • - -
  • - -
    组织框架
    -
    #icon-organization-framework-line
    -
  • - -
  • - -
    教材
    -
    #icon-jiaocai
    -
  • - -
  • - -
    在线考试
    -
    #icon-zaixiankaoshi
    -
  • - -
  • - -
    目标绘制
    -
    #icon-mubiaohuizhi
    -
  • - -
  • - -
    图谱数据源
    -
    #icon-tupushujuyuan
    -
  • - -
  • - -
    目标
    -
    #icon-mubiao
    -
  • - -
  • - -
    知识图谱
    -
    #icon-zhishitupu
    -
  • - -
  • - -
    图谱
    -
    #icon-tupu
    -
  • - -
  • - -
    中文文献
    -
    #icon-zhongwenwenxian
    -
  • - -
  • - -
    图谱
    -
    #icon-tupu1
    -
  • - -
  • - -
    框架
    -
    #icon-kuangjia
    -
  • - -
  • - -
    文献
    -
    #icon-wenxian
    -
  • - -
  • - -
    122-图谱
    -
    #icon-tupu-01
    -
  • - -
  • - -
    图谱
    -
    #icon-tupu2
    -
  • - -
  • - -
    图谱
    -
    #icon-tupu3
    -
  • - -
  • - -
    组织框架
    -
    #icon-zuzhikuangjia
    -
  • - -
  • - -
    图谱
    -
    #icon-tupu4
    -
  • - -
  • - -
    考试 (1)
    -
    #icon-a-kaoshi1
    -
  • - -
  • - -
    反馈
    -
    #icon-fankui
    -
  • - -
  • - -
    题库
    -
    #icon-tiku
    -
  • - -
  • - -
    ldc-position
    -
    #icon-ldc-position
    -
  • - -
  • - -
    素材
    -
    #icon-sucai
    -
  • - -
  • - -
    朋友
    -
    #icon-pengyou
    -
  • - -
  • - -
    作业
    -
    #icon-zuoye
    -
  • - -
  • - -
    教学分析
    -
    #icon-jiaoxuefenxi
    -
  • - -
  • - -
    文件夹
    -
    #icon-wenjianjia
    -
  • - -
  • - -
    教学研修
    -
    #icon-jiaoxueyanxiu
    -
  • - -
  • - -
    教学设计
    -
    #icon-jiaoxuesheji
    -
  • - -
  • - -
    专业资源库
    -
    #icon-zhuanyeziyuanku
    -
  • - -
  • - -
    朋友圈
    -
    #icon-pengyouquan
    -
  • - -
  • - -
    当前会话
    -
    #icon-dangqianhuihua
    -
  • - -
  • - -
    研究室
    -
    #icon-yanjiushi
    -
  • - -
  • - -
    工作台
    -
    #icon-gongzuotai
    -
  • - -
  • - -
    论文
    -
    #icon-lunwen
    -
  • - -
  • - -
    德诚_线上学习001
    -
    #icon-decheng_xianshangxuexi
    -
  • - -
  • - -
    集体备课
    -
    #icon-jitibeike-
    -
  • - -
  • - -
    课题
    -
    #icon-keti
    -
  • - -
  • - -
    朋友圈
    -
    #icon-pengyouquan1
    -
  • - -
  • - -
    备课
    -
    #icon-beike1
    -
  • - -
  • - -
    share
    -
    #icon-fenxiang
    -
  • - -
  • - -
    227注册、添加好友
    -
    #icon-zhucetianjiahaoyou
    -
  • - -
  • - -
    场景灵活
    -
    #icon-duoqudaojicheng
    -
  • - -
  • - -
    业务开展
    -
    #icon-yewukaizhan
    -
  • - -
  • - -
    反馈
    -
    #icon-fankui1
    -
  • - -
  • - -
    设置
    -
    #icon-shezhi
    -
  • - -
  • - -
    查阅
    -
    #icon-chayue
    -
  • - -
  • - -
    报告
    -
    #icon-baogao
    -
  • - -
  • - -
    学科组合
    -
    #icon-xuekezuhe
    -
  • - -
  • - -
    分享
    -
    #icon-fenxiang1
    -
  • - -
  • - -
    通知中心
    -
    #icon-tongzhizhongxin
    -
  • - -
  • - -
    下架
    -
    #icon-xiajia
    -
  • - -
  • - -
    生产过程管理
    -
    #icon-shengchanguochengguanli
    -
  • - -
  • - -
    课件
    -
    #icon-kejian
    -
  • - -
  • - -
    浏览
    -
    #icon-liulan
    -
  • - -
  • - -
    发表
    -
    #icon-fabiao
    -
  • - -
  • - -
    课程
    -
    #icon-kecheng
    -
  • - -
  • - -
    编辑
    -
    #icon-bianji1
    -
  • - -
  • - -
    评价
    -
    #icon-pingjia
    -
  • - -
  • - -
    综合诊断
    -
    #icon-zonghezhenduan
    -
  • - -
  • - -
    班级
    -
    #icon-banji
    -
  • - -
  • - -
    投诉与建议
    -
    #icon-tousuyujianyi
    -
  • - -
  • - -
    交流
    -
    #icon-jiaoliu
    -
  • - -
  • - -
    评议
    -
    #icon-pingyi
    -
  • - -
  • - -
    学情分析
    -
    #icon-xueqingfenxi
    -
  • - -
  • - -
    check
    -
    #icon-check
    -
  • - -
  • - -
    upload
    -
    #icon-upload
    -
  • - -
  • - -
    讨论
    -
    #icon-taolun
    -
  • - -
  • - -
    途径
    -
    #icon-tujing
    -
  • - -
  • - -
    咨询
    -
    #icon-zixun
    -
  • - -
  • - -
    浏览
    -
    #icon-liulan1
    -
  • - -
  • - -
    要素
    -
    #icon-yaosu
    -
  • - -
  • - -
    报告
    -
    #icon-baogao1
    -
  • - -
  • - -
    收藏
    -
    #icon-shoucang
    -
  • - -
  • - -
    审核
    -
    #icon-shenhe
    -
  • - -
  • - -
    w_多选题
    -
    #icon-w_duoxuanti
    -
  • - -
  • - -
    分析
    -
    #icon-fenxi
    -
  • - -
  • - -
    kanshu
    -
    #icon-kanshu
    -
  • - -
  • - -
    上传
    -
    #icon-qwe
    -
  • - -
  • - -
    检查
    -
    #icon-jiancha
    -
  • - -
  • - -
    群组
    -
    #icon-qunzu
    -
  • - -
  • - -
    作品
    -
    #icon-zuopin
    -
  • - -
  • - -
    数译_教学管理
    -
    #icon-shuyi_jiaoxueguanli
    -
  • - -
  • - -
    liangsuan
    -
    #icon-liangsuan
    -
  • - -
  • - -
    business-report
    -
    #icon-business-report
    -
  • - -
  • - -
    项目评审
    -
    #icon-xiangmupingshen
    -
  • - -
  • - -
    项目申报
    -
    #icon-xiangmushenbao
    -
  • - -
  • - -
    下架
    -
    #icon-xiajia1
    -
  • - -
  • - -
    分享 2
    -
    #icon-a-fenxiang2
    -
  • - -
  • - -
    考试分析
    -
    #icon-icon_kaoshifenxi
    -
  • - -
  • - -
    课堂实录 1
    -
    #icon-a-ketangshilu1
    -
  • - -
  • - -
    图标_模式类型配置
    -
    #icon-tubiao_moshileixingpeizhi
    -
  • - -
  • - -
    写作-copy
    -
    #icon-xiezuo
    -
  • - -
  • - -
    布置-copy
    -
    #icon-buzhi
    -
  • - -
  • - -
    资源分析
    -
    #icon-ziyuanfenxi
    -
  • - -
  • - -
    收藏
    -
    #icon-shoucang1
    -
  • - -
  • - -
    题目数量
    -
    #icon-iconku-zhuanqu-
    -
  • - -
  • - -
    PPT
    -
    #icon-PPT
    -
  • - -
  • - -
    发表论文
    -
    #icon-fabiaolunwen
    -
  • - -
  • - -
    写作
    -
    #icon-xiezuo1
    -
  • - -
  • - -
    粮食动态决策分析系统
    -
    #icon-fenxi1
    -
  • - -
  • - -
    课程资源
    -
    #icon-kechengziyuan
    -
  • - -
  • - -
    作业平台
    -
    #icon-36zuoyepingtai
    -
  • - -
  • - -
    结课标准-笔记数
    -
    #icon-jiekebiaozhunbijishu
    -
  • - -
  • - -
    勋章
    -
    #icon-xunzhang
    -
  • - -
  • - -
    教材征订
    -
    #icon-jiaocaizhengding
    -
  • - -
  • - -
    新增模型
    -
    #icon-xinzengmoxing
    -
  • - -
  • - -
    表彰勋章英雄
    -
    #icon-a-biaozhangxunzhangyingxiong
    -
  • - -
  • - -
    勋章
    -
    #icon-xunzhang1
    -
  • - -
  • - -
    237拍照-线性
    -
    #icon-paizhao-xianxing
    -
  • - -
  • - -
    主页未选
    -
    #icon-zhuye2
    -
  • - -
  • - -
    作业
    -
    #icon-zuoye1
    -
  • - -
  • - -
    更多
    -
    #icon-xiazai9
    -
  • - -
  • - -
    互动
    -
    #icon-hudong
    -
  • - -
  • - -
    橡皮擦
    -
    #icon-xiangpica
    -
  • - -
  • - -
    更多
    -
    #icon-gengduo
    -
  • - -
  • - -
    聚焦
    -
    #icon-jujiao
    -
  • - -
  • - -
    画笔
    -
    #icon-huabi
    -
  • - -
  • - -
    28D鼠标箭头-copy
    -
    #icon-mouse
    -
  • - -
  • - -
    下一页
    -
    #icon-xiayiye
    -
  • - -
  • - -
    上一页
    -
    #icon-shangyiye
    -
  • - -
  • - -
    双页
    -
    #icon-shuangye
    -
  • - -
  • - -
    单页模板
    -
    #icon-danyemoban
    -
  • - -
  • - -
    铃铛
    -
    #icon-lingdang
    -
  • - -
  • - -
    移动到组
    -
    #icon-yidongdaozu
    -
  • - -
  • - -
    删除
    -
    #icon-shanchu
    -
  • - -
  • - -
    下载
    -
    #icon-xiazai
    -
  • - -
  • - -
    编辑
    -
    #icon-bianji
    -
  • - -
  • - -
    云文件-
    -
    #icon-yunwenjian-
    -
  • - -
  • - -
    avi
    -
    #icon-avi
    -
  • - -
  • - -
    access
    -
    #icon-access
    -
  • - -
  • - -
    docx
    -
    #icon-docx
    -
  • - -
  • - -
    folder
    -
    #icon-folder
    -
  • - -
  • - -
    excel
    -
    #icon-excel
    -
  • - -
  • - -
    gif
    -
    #icon-gif
    -
  • - -
  • - -
    jpeg
    -
    #icon-jpeg
    -
  • - -
  • - -
    jpg
    -
    #icon-jpg
    -
  • - -
  • - -
    mp3
    -
    #icon-mp
    -
  • - -
  • - -
    mov
    -
    #icon-mov
    -
  • - -
  • - -
    pdf
    -
    #icon-pdf
    -
  • - -
  • - -
    ppt
    -
    #icon-ppt
    -
  • - -
  • - -
    papers
    -
    #icon-papers
    -
  • - -
  • - -
    pptx
    -
    #icon-pptx
    -
  • - -
  • - -
    psd
    -
    #icon-psd
    -
  • - -
  • - -
    rar
    -
    #icon-rar
    -
  • - -
  • - -
    txt
    -
    #icon-txt
    -
  • - -
  • - -
    zip
    -
    #icon-zip
    -
  • - -
  • - -
    video
    -
    #icon-video
    -
  • - -
  • - -
    xlsx
    -
    #icon-xlsx
    -
  • - -
  • - -
    png
    -
    #icon-png
    -
  • - -
  • - -
    word
    -
    #icon-word
    -
  • - -
  • - -
    省略号
    -
    #icon-shenglvehao
    -
  • - -
  • - -
    加号
    -
    #icon-jiahao
    -
  • - -
  • - -
    关闭
    -
    #icon-guanbi
    -
  • - -
  • - -
    向右
    -
    #icon-xiangyou
    -
  • - -
  • - -
    讲课
    -
    #icon-jiangke1
    -
  • - -
  • - -
    教学资源
    -
    #icon-jiaoxueziyuan
    -
  • - -
  • - -
    备课
    -
    #icon-beike
    -
  • - -
  • - -
    最大化
    -
    #icon-zuidahua
    -
  • - -
  • - -
    窗口-最大化_line
    -
    #icon-window-max_line
    -
  • - -
  • - -
    最小化
    -
    #icon-zuixiaohua
    -
  • - -
  • - -
    关闭
    -
    #icon-close
    -
  • - -
-
-

Symbol 引用

-
- -

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

-
    -
  • 支持多色图标了,不再受单色限制。
  • -
  • 通过一些技巧,支持像字体那样,通过 font-size, color 来调整样式。
  • -
  • 兼容性较差,支持 IE9+,及现代浏览器。
  • -
  • 浏览器渲染 SVG 的性能一般,还不如 png。
  • -
-

使用步骤如下:

-

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

-
<script src="./iconfont.js"></script>
-
-

第二步:加入通用 CSS 代码(引入一次就行):

-
<style>
-.icon {
-  width: 1em;
-  height: 1em;
-  vertical-align: -0.15em;
-  fill: currentColor;
-  overflow: hidden;
-}
-</style>
-
-

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

-
<svg class="icon" aria-hidden="true">
-  <use xlink:href="#icon-xxx"></use>
-</svg>
-
-
-
- -
-
- - - diff --git a/src/renderer/src/assets/iconfont/iconfont.css b/src/renderer/src/assets/iconfont/iconfont.css index 4b2269b..37480ed 100644 --- a/src/renderer/src/assets/iconfont/iconfont.css +++ b/src/renderer/src/assets/iconfont/iconfont.css @@ -1,9 +1,9 @@ @font-face { font-family: "iconfont"; /* Project id 2794390 */ - src: url('iconfont.woff2?t=1723022855912') format('woff2'), - url('iconfont.woff?t=1723022855912') format('woff'), - url('iconfont.ttf?t=1723022855912') format('truetype'), - url('iconfont.svg?t=1723022855912#iconfont') format('svg'); + src: url('iconfont.woff2?t=1723099371232') format('woff2'), + url('iconfont.woff?t=1723099371232') format('woff'), + url('iconfont.ttf?t=1723099371232') format('truetype'), + url('iconfont.svg?t=1723099371232#iconfont') format('svg'); } .iconfont { @@ -486,6 +486,10 @@ content: "\e604"; } +.icon-zuoye2:before { + content: "\f48d"; +} + .icon-zuoye1:before { content: "\e610"; } diff --git a/src/renderer/src/assets/iconfont/iconfont.js b/src/renderer/src/assets/iconfont/iconfont.js index 009e48d..877986f 100644 --- a/src/renderer/src/assets/iconfont/iconfont.js +++ b/src/renderer/src/assets/iconfont/iconfont.js @@ -1 +1 @@ -window._iconfont_svg_string_2794390='',function(l){var h=(h=document.getElementsByTagName("script"))[h.length-1],c=h.getAttribute("data-injectcss"),h=h.getAttribute("data-disable-injectsvg");if(!h){var a,v,t,z,i,p=function(h,c){c.parentNode.insertBefore(h,c)};if(c&&!l.__iconfont__svg__cssinject__){l.__iconfont__svg__cssinject__=!0;try{document.write("")}catch(h){console&&console.log(h)}}a=function(){var h,c=document.createElement("div");c.innerHTML=l._iconfont_svg_string_2794390,(c=c.getElementsByTagName("svg")[0])&&(c.setAttribute("aria-hidden","true"),c.style.position="absolute",c.style.width=0,c.style.height=0,c.style.overflow="hidden",c=c,(h=document.body).firstChild?p(c,h.firstChild):h.appendChild(c))},document.addEventListener?~["complete","loaded","interactive"].indexOf(document.readyState)?setTimeout(a,0):(v=function(){document.removeEventListener("DOMContentLoaded",v,!1),a()},document.addEventListener("DOMContentLoaded",v,!1)):document.attachEvent&&(t=a,z=l.document,i=!1,d(),z.onreadystatechange=function(){"complete"==z.readyState&&(z.onreadystatechange=null,M())})}function M(){i||(i=!0,t())}function d(){try{z.documentElement.doScroll("left")}catch(h){return void setTimeout(d,50)}M()}}(window); \ No newline at end of file +window._iconfont_svg_string_2794390='',function(l){var h=(h=document.getElementsByTagName("script"))[h.length-1],c=h.getAttribute("data-injectcss"),h=h.getAttribute("data-disable-injectsvg");if(!h){var a,v,t,z,i,p=function(h,c){c.parentNode.insertBefore(h,c)};if(c&&!l.__iconfont__svg__cssinject__){l.__iconfont__svg__cssinject__=!0;try{document.write("")}catch(h){console&&console.log(h)}}a=function(){var h,c=document.createElement("div");c.innerHTML=l._iconfont_svg_string_2794390,(c=c.getElementsByTagName("svg")[0])&&(c.setAttribute("aria-hidden","true"),c.style.position="absolute",c.style.width=0,c.style.height=0,c.style.overflow="hidden",c=c,(h=document.body).firstChild?p(c,h.firstChild):h.appendChild(c))},document.addEventListener?~["complete","loaded","interactive"].indexOf(document.readyState)?setTimeout(a,0):(v=function(){document.removeEventListener("DOMContentLoaded",v,!1),a()},document.addEventListener("DOMContentLoaded",v,!1)):document.attachEvent&&(t=a,z=l.document,i=!1,d(),z.onreadystatechange=function(){"complete"==z.readyState&&(z.onreadystatechange=null,M())})}function M(){i||(i=!0,t())}function d(){try{z.documentElement.doScroll("left")}catch(h){return void setTimeout(d,50)}M()}}(window); \ No newline at end of file diff --git a/src/renderer/src/assets/iconfont/iconfont.json b/src/renderer/src/assets/iconfont/iconfont.json index d899edc..f18e77b 100644 --- a/src/renderer/src/assets/iconfont/iconfont.json +++ b/src/renderer/src/assets/iconfont/iconfont.json @@ -831,6 +831,13 @@ "unicode": "e604", "unicode_decimal": 58884 }, + { + "icon_id": "41372607", + "name": "作业-2", + "font_class": "zuoye2", + "unicode": "f48d", + "unicode_decimal": 62605 + }, { "icon_id": "8023423", "name": "作业", diff --git a/src/renderer/src/assets/iconfont/iconfont.svg b/src/renderer/src/assets/iconfont/iconfont.svg index 039cc95..0731898 100644 --- a/src/renderer/src/assets/iconfont/iconfont.svg +++ b/src/renderer/src/assets/iconfont/iconfont.svg @@ -250,6 +250,8 @@ + + diff --git a/src/renderer/src/assets/iconfont/iconfont.ttf b/src/renderer/src/assets/iconfont/iconfont.ttf index 18826b1..a08d65f 100644 Binary files a/src/renderer/src/assets/iconfont/iconfont.ttf and b/src/renderer/src/assets/iconfont/iconfont.ttf differ diff --git a/src/renderer/src/assets/iconfont/iconfont.woff b/src/renderer/src/assets/iconfont/iconfont.woff index 86e2bb1..9364823 100644 Binary files a/src/renderer/src/assets/iconfont/iconfont.woff and b/src/renderer/src/assets/iconfont/iconfont.woff differ diff --git a/src/renderer/src/assets/iconfont/iconfont.woff2 b/src/renderer/src/assets/iconfont/iconfont.woff2 index 756b9e2..2a2f9f6 100644 Binary files a/src/renderer/src/assets/iconfont/iconfont.woff2 and b/src/renderer/src/assets/iconfont/iconfont.woff2 differ diff --git a/src/renderer/src/views/prepare/container/set-homework.vue b/src/renderer/src/views/prepare/container/set-homework.vue index 7e821ac..f591826 100644 --- a/src/renderer/src/views/prepare/container/set-homework.vue +++ b/src/renderer/src/views/prepare/container/set-homework.vue @@ -1,9 +1,9 @@