如何使用资产管道插件的字体和背景图像?

时间:2014-02-23 15:18:39

标签: css laravel laravel-4 asset-pipeline font-face

我正在使用CodeSleeve的asset-pipeline来管理我的Laravel项目(PHP框架)上的样式表。 application.css文件已下载,但允许使用图片和使用字体的方法是什么?

我的application.css文件:

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

#h-navbar {
    font-family: mrsMonster;
    background: url('/images/banniere.png') no-repeat;
}

1 个答案:

答案 0 :(得分:1)

解决方案是将 fonts文件夹放入样式表目录,然后写:

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

图片文件夹可以与样式表文件夹处于同一级别,然后您应该写道:

background: url('myImage.png');