覆盖模板页面中的字体

Question

我正在尝试覆盖我网站模板中的字体

我在内部css中尝试了这个

<style type="text/css">
    @font-face
    {
        font-family:avenir-black;
        src: url('{{ asset('fonts/AvenirLTStd-Black.woff') }}') format('woff');
    }
    @font-face
    {
        font-family:avenir-medium;
        src: url('{{ asset('fonts/AvenirLTStd-Medium.woff') }}') format('woff');
    }
    @font-face
    {
        font-family:avenir-light;
        src: url('{{ asset('fonts/AvenirLTStd-Light.woff') }}') format('woff');
    }
    .avenir-black
    {
        font-family:avenir-black;
    }
</style>

这就是我使用类

的方式

<div class="home-text avenir-black">
            <h1 class="hs-line-14">
                WHERE TO STAY?
            </h1>
            <br><br>
            <h1 class="hs-line-15">
                Need somewhere to stay?
            </h1>
            <h1 class="hs-line-8">
                We have a list of possibilities!
            </h1>
            <br><br><br><br><br><br><br><br><br><br><br>
            <div class="local-scroll">
                <a class="scroll-nav local-scroll" href="#hotels">
                    <h1 class="hs-line-10">
                        See All Possibilities
                    </h1>
                </a>
            </div>
        </div>

但什么也没发生..我使用laravel 5.2作为我的框架，我将字体文件保存在public / fonts文件夹中