laravel-链接到自定义字体 [英] laravel - linking to custom fonts
问题描述
I have already asked and played around with this question on Laravel discussions here (https://laracasts.com/discuss/channels/code-review/linking-to-custom-font-file-from-a-stylesheet-inside-a-blade-template). moving the file back to the stylesheet and removing the asset in the link the did not. I am trying to import custom fonts into my website, but because of Laravel's router, I can't directly link to the font files in my CSS. how can I get my custom fonts to display in the browser? So far, this dosent work:
@font-face { font-family: NexaBold; src: url('{!! asset('build/fonts/NexaBold.otf') !!}'); }
@font-face { font-family: NexaLight; src: url('{!! asset('build/fonts/NexaLight.otf') !!}'); }
@font-face { font-family: OpenSans; src: url('{!! asset('build/fontsOpenSans-Regular.ttf') !!}'); }
我尝试用public_path替换资产,但这也不起作用.如何使用Laravel刀片引擎显示字体?
I tried replacing asset with public_path but that didn't work either. How do I get my fonts to display using the Laravel blade engine?
推荐答案
您可以将字体放在此目录/storage/app/public/fonts 中,以便可以从前端访问它们:
You can put your fonts in this directory /storage/app/public/fonts, so they can be accessible from the frontend:
这是您导入它们的方法:
This is how you can import them:
@font-face {
font-family:'NexaBold';
src: url('/fonts/NexaBold.otf') format('otf');
font-style: normal;
font-weight: normal;
}
@font-face {
font-family:'NexaLight';
src: url('/fonts/NexaLight.otf') format('otf');
font-style: normal;
font-weight: normal;
}
@font-face {
font-family:'OpenSans';
src: url('/fonts/OpenSans-Regular.ttf') format('ttf');
font-style: normal;
font-weight: normal;
}
比为某些元素设置样式:
Than to style some elements:
body{
font-family: NexaLight,Arial,Helvetica,sans-serif;
}
h1, h2{
font-family: NexaBold,Arial,Helvetica,sans-serif;
}
这篇关于laravel-链接到自定义字体的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!