zoukankan      html  css  js  c++  java
  • 给font awesome中加入自定义图片

    工具:http://icomoon.io 在线工具

    http://www.inkscape.org/en/download/windows/ 下载安装

    参考教程 http://birchenough.co.uk/edit-font-awesome-icon-add-font-awesome-font/

    访问 http://icomoon.io/ 

    点击右上角image

    界面加载完成后,点击左上角 image

    选择你现在正在使用的font awesome对应的svg文件,一定要是现在使用的,防止出现ico不对应

    image

    image

    之后会加载出目前现有的ico

    使用工具编辑image

    编辑任意一个

    image

    弹出框中选择download,保存到本地

    打开incspace,image使用打开功能打开刚才下载的文件,注意一定要使用打开,而不要把文件拖到软件里

    image使用打开后,纸张大小会变化

    image使用拖动,纸张大小不会变

    我们需要的是他的纸张大小

    可以在原有的基础上修改

    也可以把原有的删掉自己重画

    image随便画个什么,尽量充满画纸

    image另存为,普通svg

    回到网页

    image

    导入到set,选择刚刚制作的svg

    image默认会放到第一个

    如果希望,可以移动位置image

    编辑

    imagetags就是生成的css的class,默认和文件名一样,可以修改,最终会生成icon-test

    image全选

    下方image,点完以后可能会有一段时间没反应,耐心等待

    image

    文字是e600,font awesome默认是从f000开始,如果你想继续,也可以修改这个e600

    上方的image,点击后弹出更多设置

    最后下方image

    找到font文件夹中的几个文件

    image,复制到原来的font目录下

    打开原来的font-awesome.css

    image修改这里的路径,对应到刚才的几个文件

    打开下载的style.css

    找到

    image

    这是我们刚加进去的那个ico,把这个类复制到原来的css文件中

    如果使用到了ie7,你可以同样的修改一下ie7的css

    注意,svg是矢量图,所以你的图中的 点,线 越少,生成的文件越小,否则会非常大

  • 相关阅读:
    JAVA基础学习(7)之函数
    人与神话阅读笔记03
    学习进度八
    人月神话阅读笔记02
    NABCD原则
    人月神话阅读笔记01
    学习进度七
    学习进度六
    梦断代码阅读笔记03
    地铁系统初步思路
  • 原文地址:https://www.cnblogs.com/czcz1024/p/3544387.html
Copyright © 2011-2022 走看看