开发指南016-前端图标规范

简介: 平台为了保证统一性,做了很多约定,例如按钮图标等

平台为了保证统一性,做了很多约定,例如按钮图标等,平台规定图标取自这两个地方。在整个平台上运行的系统必须保持一致。在这个层面上不允许个性发挥。

1)    font-awesome

import 'font-awesome/css/font-awesome.min.css' // font-awesome

查图标:

https://www.runoob.com/font-awesome/fontawesome-reference.html

2)    element-ui图标

import 'element-ui/lib/theme-chalk/icon.css'

查图标:

https://element.eleme.cn/#/zh-CN/component/icon

规定如下

新增:<i class="el-icon-plus" />

查询:<i class="el-icon-search" />

重置:<i class="el-icon-refresh" />

刷新:<i class="el-icon-refresh-right" />

编辑/修改:<i class="el-icon-edit" />

删除:<i class="el-icon-delete" />

作废:<i class="el-icon-takeaway-box" />

分发:<i class="el-icon-position" />

设置:<i class="el-icon-setting" />

发布:<i class="el-icon-data-line" />

查看基本信息:<i class="el-icon-document" />

查看关联信息:<i class="el-icon-postcard" />

查看图片:<i class=" el-icon-picture-outline" />

查看流程:<i class="el-icon-notebook-2" />

查看日志: <i class="el-icon-collection-tag" />

确认:<i class="el-icon-check" />

关闭:<i class="el-icon-close" />

上传:<i class="el-icon-upload2 " />

下载:<i class="el-icon-download" />

打印:<i class="el-icon-printer " />

复制:<i class="el-icon-copy-document" />

关联:<i class="el-icon-connection" />

归档: <i class="el-icon-sell" />

启用:<i class="el-icon-video-play" />

禁用:<i class="el-icon-video-pause" />

打开/开通: <i class="el-icon-folder-opened " />

修改密码:<i class="el-icon-key" />

授权: <i class="el-icon-unlock" />

修改头像: <i class="el-icon-user" />

预览:<i class="el-icon-data-board" />

导出: <i class="el-icon-tickets" />

申报:<i class="el-icon-aim" />

切换:<i class="el-icon-sort" />

保存: <i class="el-icon-suitcase" />

取消/关闭:<i class="el-icon-switch-button" />

定位: <i class="el-icon-location-information" />

下一个: <i class="el-icon-right" />

通过: <i class="el-icon-folder-checked" />

退回: <i class="el-icon-folder-delete" />

相关文章
|
1月前
|
前端开发 测试技术
如何从零到一建立前端规范
【10月更文挑战第6天】
55 2
|
6月前
|
前端开发 JavaScript API
前端代码书写规范
前端代码规范提升项目可维护性和团队协作效率。关注项目命名清晰简洁、一致性,组件命名使用驼峰式且具描述性。JS遵循4空格缩进,分号结束语句,CSS按逻辑排序,HTML注重语义化。注释要功能性、文档化且简洁。遵循规范能减少错误,增强团队沟通。
292 3
|
3月前
|
前端开发 JavaScript 开发工具
前端规范
前端规范
|
1月前
|
前端开发
开发指南047-前端模块版本
平台前端框架内置了一个文件version.vue
|
2月前
|
监控 前端开发 开发者
前端代码规范 - 日志打印规范
前端代码规范 - 日志打印规范
|
3月前
|
前端开发
如何在前端项目中单独引入 ElementUI 图标以及使用
这篇文章介绍了如何在前端项目中单独引入Element UI的图标文件以及如何使用这些图标。
306 0
如何在前端项目中单独引入 ElementUI 图标以及使用
|
3月前
|
缓存 JavaScript 前端开发
|
3月前
|
前端开发
前端ElementPlus框架中的几种图标按钮使用方式
本文介绍了如何在Element Plus前端框架中使用带有图标的按钮,包括设置按钮大小、图标大小、按钮类型以及如何为图标添加点击事件。
319 0
|
3月前
|
前端开发
前端代码书写规范
【8月更文挑战第15天】前端代码书写规范
58 0