直到窗口在chrome中调整大小时才会显示字体

Question

我正在使用angular2和webpack.像这样加载我的字体:

@font-face {
  font-family: 'bpmonoregular';
  src: url('assets/fonts/bpmono_regular_macroman/BPmono-webfont.eot');
  src: url('assets/fonts/bpmono_regular_macroman/BPmono-webfont.eot?#iefix') format('embedded-opentype'),
  url('assets/fonts/bpmono_regular_macroman/BPmono-webfont.woff') format('woff'),
  url('assets/fonts/bpmono_regular_macroman/BPmono-webfont.ttf') format('truetype'),
  url('assets/fonts/bpmono_regular_macroman/BPmono-webfont.svg#bpmonoregular') format('svg');
  font-weight: normal;
  font-style: normal;
}

如果在我的CSS中我增加了字体大小百分比,除非加载了第一个组件,否则字体不会显示.一旦我切换页面,它就会消失.如果我调整窗口大小,它会显示出来.

这只发生在chrome中

Answer 1

您可以尝试使用document.ready上的代码触发window.resize作为解决方法.