The font library in the project was loaded successfully, but could not be displayed

font library loaded successfully

clipboard.png


clipboard.png

clipboard.png

this is the reference and loading code of the font library file

@font-face {
  font-family: "icomoon";
  src:  url("../fonts/icomoon.eot?q7r210");
  src:  url("../fonts/icomoon.eot?q7r210-sharpiefix") format("embedded-opentype"),
  url("../fonts/icomoon.ttf?q7r210") format("truetype"),
  url("../fonts/icomoon.woff?q7r210") format("woff"),
  url("../fonts/icomoon.svg?q7r210-sharpicomoon") format("svg");
  font-weight: normal;
  font-style: normal;
}

[class^="icon-"], [class*=" icon-"] {
  /* use !important to prevent issues with browser extensions that change fonts */
  font-family: "icomoon" !important;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;

  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icon-32:before {
  content: "\e900";
}
.icon-2444:before {
  content: "\e901";
}
Mar.22,2021

Failed to decode downloaded font

the problem has been solved, and the mistake reported before has never been seen.
is when the backend is packaged, the font library is compiled and the font library file is corrupted.

<webResources>
<resource>
<directory>src/main/webapp</directory>
<filtering>false</filtering>
</resource>
</webResources>

package and drop the font library Filter.
can refer to this answer

.

relative path absolute path problem?


you didn't write font-family: "iconfont"

Menu