伪类选择器添加阿里图标的方法

阿里图标库下载源码得到 iconfont.css

@font-face {font-family: "iconfont";
  src: url('iconfont.eot?t=1591689630095'); /* IE9 */
  src: url('iconfont.eot?t=1591689630095#iefix') format('embedded-opentype'), /* IE6-IE8 */
  url('data:application/x-font-woff2;charset=utf-8;base64,d09GMgABAAAAAANQAAsAAAAABzAAAAMEAAEAAAAAAAAAAAAAAAAAAAAAAAAAAAAAHEIGVgCDBgqCEIIeATYCJAMMCwgABCAFhG0HPhtsBhHVk7lkf0ngpogmL+K2d8geFKywJ1vI1fNa0SAeBzFGoONyK2X50y5uInfwmeCp34/92buLiSaieRORRCIRXROh4SEyJBLDdGti39pvrwECZMAGgM9zrr8KsijgvQEV8IBbG3C0vjui04XwFZ9O7sKBUYskkEd2ukAHJ1xgUdpRBgwnKpm9Uhbn6hDc6Qg1kufhSaEdJl02TtOHFPx8zyEGuj/unf4WUCDzWW2XOSZ2n7oA44ACG2tSZAUSkKcSXpeB7oTncQgQSKpiUu++fU78MZxxAshMZNKJfymEYVLWH8G3ZalB9vHB35VOwF78ffnG8gcOH4UztXX6Vkyq37TvtL1iMEQQL+cApFWgQDEwkOHWVC+KSEQlUGX9xb4Yglsq6v1jkanxPegfz4H4wqkMBiAfaQdvmk+HwFv3Ag4ABcAXCAE6gHkQousCsGCaZhjsyhGyTAvxvnceR9d19ZznoCgSwTC+EVmBpqWmp4CUGPq7CYq6my5IBLYA/OKV/RKBA8WyebZwvnWarokPS/RC7/0vjRbW66XyPa93qQ5besV5KQk0X93C/4aX83v+CnggeeEgH1GAhjyvMcpWyJcXQMb3vD2u3/G+LlQp/mk4AN70RAuAzpH//4ff8JDbx+fyn79EA+CRGe/jkDeDrvF/SrfAty4mNpkpdcxqusgX2VmlVMB7MhJoevHk+CK9TNfEkCtB8CcmB4cfKaD4k40xQjH4EEQZ+OJPFQRSpGl1EFFmUcQEQKEVBkK4a3CEcgNKuHuMEZ7Bh1i/wJfwFALplqgtg8iN5h3BVLGA7B847zvyrLpLqt/RuCaVojQmfaNYjkLoBdXsAzuUJWbYHxOpEpD0LdzZadg0PQzSV5irV6oOV9+ntjd5ed9OdhOCqWIB2T9w3ncUttdd7fPvaFyTSg+qwfuNYrl7CL2AgHmoOhLqUV6xPyZSJSDpW7gzBzZuqoehfVCFuXrlhMRw9blWRFV522vaz7cDQJw491FTJypGlHal44I7k7nlbEueTAA=') format('woff2'),
  url('iconfont.woff?t=1591689630095') format('woff'),
  url('iconfont.ttf?t=1591689630095') format('truetype'), /* chrome, firefox, opera, Safari, Android, iOS 4.2+ */
  url('iconfont.svg?t=1591689630095#iconfont') format('svg'); /* iOS 4.1- */
}

.iconfont {
  font-family: "iconfont" !important;
  font-size: 16px;
  font-style: normal;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icon-fanhuidingbu:before {
  content: "\e62d";
}

.icon-tishi:before {
  content: "\e68e";
}

应用在html中任意标签

.class::after{
    content:'\e62d';
    font-family:iconfont;
}
.class::before{
    content:'\e68e';
    font-family:iconfont;
}

你可能感兴趣的:(字体图标库,html,css)