CSS样式——CSS3新特性

• 创建自定义字体图标

  • @font-face可定义图标字体，将图标字体嵌入到网页中，并且可使用文本所i有样式
  • 使用语法：

  @font-face {
    font-family: 自定义图标字体名;
    src: url(‘图标地址’);
  }
  div{
    font-family: 自定图标字体名;
  }
  /*使用图标字体*/
  p::after,p::before{
  content: 图标字体名;
  }

  • 字体图标库的使用
  • 下载字体图标文件
    阿里字体图标库：https://www.iconfont.cn/
    自定义字体图标：https://icomoon.io/app/#/select

  // 单色字体图标
  
  <标签名 class="icon 图标名">
  
  // 彩色字体图标