zoukankan      html  css  js  c++  java
  • 关于字体图标的问题

    作为前端,我们经常需要和美工拿字体图标文件,经常遇到的有eot,ttf,woff,svg
    拿到字体图标文件,我们就要进行一个字体图标文件css编写,方便后期使用

    @font-face {
      /* 1.首先指定字体的系列,我们指定为字体图标 */
      font-family: "自定义字体图标名称";
      /* 2.接下来的代码指定了字体图标的路径,兼容了各种移动端浏览器和PC端浏览器,你可以根据自己的需要,删除不必要的兼容 */
      src: url('eot文件路径'); /* IE9*/
      src: url('eot文件路径#iefix') format('embedded-opentype'), /* IE6-IE8 */
      url('woff文件路径') format('woff'),
      url('ttf文件路径') format('truetype'), /* chrome, firefox, opera, Safari, Android, iOS 4.2+*/
      url('svg文件路径') format('svg'); /* iOS 4.1- */
    }
    /* 3.这里设置字体图标的默认样式,你可以更改默认样式 */
    .自定义字体图标名称 {
      font-family:"自定义字体图标名称" !important;
      font-size:16px;
      font-style:normal;
      -webkit-font-smoothing: antialiased;
      -moz-osx-font-smoothing: grayscale;
    }
    /* 4.下面的代码就是我们的字体图标使用时引入的代码,通过伪元素 :before 引入的 */
    .icon-guangpan::before { content: "e604"; }
     
    .icon-zanting::before { content: "e64b"; }
    
  • 相关阅读:
    【巷子】:关于Apply、call、bind的详解
    关于this的指向问题
    SOA和微服务之间的区别
    业务系统如何微服务化
    微服务架构的理论基础
    每个架构师都应该研究下康威定律
    Rabbit MQ
    Scalability, Availability & Stability Patterns
    应用层协议
    SSO
  • 原文地址:https://www.cnblogs.com/reyirfw/p/13159470.html
Copyright © 2011-2022 走看看