font-awesome not working in IE 11, if font downloa

2019-01-23 21:44发布

I used Font-awesome-min.css were working fine in IE 11 and chrome.

But my Client requirement is to use font-awesome even we disabled the font download from IE Internet option (Internet options -> Security -> Custome level -> Download -> Font download -> Disable).

any suggestion?

3条回答
唯我独甜
2楼-- · 2019-01-23 22:40

The hard way is to switch to png-based https://github.com/encharm/Font-Awesome-SVG-PNG or you can change the specific icons you want to use into png file and change content of that icon in .css file

查看更多
我想做一个坏孩纸
3楼-- · 2019-01-23 22:44

This is fixable. You just need to Base64 the font and include it in a CSS file. Make sure to remove your call to the downloadable WOFF file once you include the call to the new FontAwesomeB64.css

Use https://www.base64encode.org/ to encode the WOFF Font-Awesome font file.

Edit the the resulting file and add these lines. When you get to the src:url line, make sure to run that right into the base64 information you received (don't use the greater than and less than signs I show here.) At the end of that base64 information add the single quote, parentheses, a semi-colon, and curly brace to finish:

@font-face { 
font-weight: 400;
font-style: normal;
font-family: 'FontAwesome';
src:url(data:application/x-font-woff;base64,<insert base64 code here>);}

You now have a base64 CSS file of the Font-Awesome font that bypasses all font download denial settings in browsers.

I've found that this works with all fonts, a little heavier on the download but worth the guarantee of functionality.

查看更多
爱情/是我丢掉的垃圾
4楼-- · 2019-01-23 22:50

Base 64 encoding does not work, entirely. It works fine on Chrome, but in IE 11 with Font Downloads disabled, it does not work.

This makes sense and does not surprise me. From a security perspective, if you don't allow 3rd party fonts to render on your system, then why would an embedded font in CSS be treated any different? It is still a 3rd party font being downloaded from an untrusted source.

Many solutions:

  • Don't use FA.
  • Use FA as images.
  • Convince the Domain admin to Enable Font Downloads.
  • Install the font locally (via Group Policy) and use url: local(myFont.woff).
  • If the site is internal, add it to the Trusted Sites zone and ensure Font Downloads are Enabled.
查看更多
登录 后发表回答