zoukankan      html  css  js  c++  java
  • iconfont采坑

    1. iconfont采坑

    1.1. 前言

    1. 使用iconfont过程中踩过坑特此记录
    2. 不知道iconfont的这里也简单介绍一笔,阿里开放的一个图标素材库,用来快速找图标下载使用图标
    3. iconfont网址

    1.2. 所谓单色

    1. iconfont中有些图标,看着是单色的,也就是整体单色,中间有些白,但是白色和无色还是有区别的啊,当我拿了一个蓝白相间的图标过去赋值个颜色,这个图片就整个一块同色区,所以选图标的时候要看仔细了,编辑下是否中间是白色的

    1.3. iconfont的三种使用模式

    1.3.1. unicode

    1. 最原始的使用方式,也是最通用的,支持范围最广,但只支持单色

    1.3.2. font class

    1. 兼容性较好,语义明确,书写更简单,但其也只支持单色的,它和unicode的区别很大程度就是写法不一样点,更多时候就用font class

    1.3.3. symbol

    1. 全新的一种方式,介绍说是未来趋势,毕竟它支持多色图标,但是它的兼容性较差,这也是比较容易遇到的坑点

    1.3.4. 我遇到的相关坑

    1. 前两种方式引入的图片哪怕找来是彩色的引入默认会是黑白色的,所以你找的图标如果本身是彩色的或是除黑白以外的其它单色,那要小心了,可能就会遇到里面轮廓是填充色,那么一旦你给它的颜色,那就是一坨xx在那里了;
    2. 解决办法最简单的就是,如果你要放的图片本身就是单色的,那就去图标库找黑白图标,那种图标本身设计就会是镂空的,给个颜色后就像写字一样一笔一划颜色就出来了
    3. 如果你本身要找彩色的图标,那么我是不建议用symbol的,或许以后成熟的可以用,但现在你用了这个,在浏览器里看可能是没问题的,但如果是写小程序,写app啥的,那就说不定了。我就在写小程序的时候试了symbol,报错不能进行下去了,还是回滚变成了引入图片

    1.4. 总结

    1. 总的来说,我的总结就是遇到需要单色图标的时候用font class,复杂颜色的图标只能控制大小直接引入图片了,当然你也可以试试在你编写的环境能不能用symbol,踩踩坑小ks
  • 相关阅读:
    window.location.href的使用方法
    hdu 2850 Load Balancing (优先队列 + 贪心)
    几种常见模式识别算法整理和总结
    【DateStructure】 Charnming usages of Map collection in Java
    编写你自己的单点登录(SSO)服务
    微软历史最高市值是多少?
    Tomcat配置一个ip绑定多个域名
    递归算法:求序列的全排列
    SMTP协议分析
    platform_device与platform_driver
  • 原文地址:https://www.cnblogs.com/sky-chen/p/11069038.html
Copyright © 2011-2022 走看看