完成Laravel 5的初学者,并尝试使用我的标头中的以下代码导入自定义字体:
<style>
@font-face {
font-family: 'Conv_OptimusPrinceps';
src: url('fonts/OptimusPrinceps.eot');
src: local('☺'), url('fonts/OptimusPrinceps.woff') format('woff'), url('fonts/OptimusPrinceps.ttf') format('truetype'), url('fonts/OptimusPrinceps.svg') format('svg');
font-weight: normal;
font-style: normal;
}
并在我的variables.scss中调用它。目前,我的字体存储在我的公共目录中:
public/fonts/OptimusPrinceps.woff
public/fonts/OptimusPrinceps.tff
etc.
由于某种原因,此警告出现在我的开发工具中
Failed to decode downloaded font: http://localhost:3000/fonts/OptimusPrinceps.tff
OTS parsing error: invalid version tag
而且我的字体无法正确加载。
放置客户端浏览器应访问的任何内容/public/
。您可以使用Laravel帮助器功能public_path
为其构建完整的URL。
https://laravel.com/docs/5.2/helpers#method-public-path
例如,如果您放入字体/public/fonts/OptimusPrinceps.tff
(已完成),则可以使用以下两种方法之一进行访问。
在刀片中:
<style type="text/css">
@font-face {
font-family: OptimusPrinceps;
src: url('{{ public_path('fonts/OptimusPrinceps.tff') }}');
}
</style>
在CSS中包括:
@font-face {
font-family: OptimusPrinceps;
src: url('/fonts/OptimusPrinceps.tff');
}
在第二个示例中,您实际上不需要任何Laravel魔术。只需绝对引用该路径,以使其指向正确的目录即可。
值得一提的是,这适用于Bootstrap和SCSS。我通常把字体放进去/public/static/fonts/
。
本文收集自互联网,转载请注明来源。
如有侵权,请联系[email protected] 删除。
我来说两句