【问题标题】:Ionicons: How to add custom icons?Ionicons:如何添加自定义图标?
【发布时间】:2015-08-08 01:57:45
【问题描述】:

如何向 ionicons 添加自定义图标? 我还没有找到一步一步的指示该怎么做。 有很多非常基本的图标(如段落图标 例如)不是由离子提供的,所以我不知何故 必须自己添加。

【问题讨论】:

    标签: ionic-framework ionicons


    【解决方案1】:

    下载字体以包含在我们的项目中。继续下载最新的 Font Awesome 版本并提取它们。将以下字体文件复制到您的 www/fonts 目录中:

    1. ontawesome-webfont.ttf
    2. fontawesome-webfont.eot
    3. fontawesome-webfont.svg
    4. fontawesome-webfont-woff
    5. fontawesome-webfont.otf 接下来,我们需要编辑 www/css/style.css 以包含这个新字体集以在我们的项目中使用。添加以下行:

    @font-face {
        font-family: 'fontawesome';
        src:url('../fonts/fontawesome-webfont.eot');
        src:url('../fonts/fontawesome-webfont.eot') format('embedded-opentype'),
            url('../fonts/fontawesome-webfont.woff') format('woff'),
            url('../fonts/fontawesome-webfont.ttf') format('truetype'),
            url('../fonts/fontawesome-webfont.svg') format('svg');
        font-weight: normal;
        font-style: normal;
    }

    每次我们想使用 Font Awesome 集时,我们只需将字体系列设置为 fontawesome。

    获取更多自定义图标https://icomoon.io/

    【讨论】:

    • 你的回答是关于字体的。我们如何添加自定义图标?我们自己创建的图标,而不是第三方库。
    • fontawesome 有很多图标。
    猜你喜欢
    • 2016-11-11
    • 1970-01-01
    • 2021-12-04
    • 1970-01-01
    • 1970-01-01
    • 2011-04-14
    • 2020-02-15
    • 1970-01-01
    • 2021-12-23
    相关资源
    最近更新 更多