Использование CSS3 @font-face в веб-приложении Grails

Кто-нибудь может пролить свет на то, как использовать стиль CSS3 @font-face в веб-приложении Grails. Как мне заставить приложение включить шрифт в войну и как я могу сослаться на него.

Я новичок в Grails и не знаю, куда именно поместить шрифты, чтобы на них можно было ссылаться в CSS.

Спасибо!

ОБНОВЛЕНИЕ

Кажется, что поместить его в каталог web-app не получится. Например, предположим, что имя файла шрифта myfont.ttf. Я помещаю его в каталог web-app, а затем в своем css делаю:

@font-face {
    font-family: myfont;
    src: url('myfont.ttf');
}

Насколько я знаю, это правильно, но, похоже, он не работает, когда я запускаю его из STS.


grails css font-face
person Nico Huysamen    schedule 20.10.2011    source источник

Ответы (2)


arrow_upward
1
arrow_downward

Если вы используете службу встраивания шрифтов, такую ​​как API бесплатных веб-шрифтов Google (http://www.google.com/webfonts), вам не нужно добавлять шрифты в свое приложение. Вы просто берете сгенерированные JS-включения и сгенерированный CSS, вставляете их и используете. Легкий.

person Moin Zaman    schedule 20.10.2011
comment
Ну, у меня есть шрифт, который я хочу использовать. Однако посмотрю на веб-шрифты Google, может быть, у них есть тот, который я смогу использовать. - person Nico Huysamen; 20.10.2011
comment
@Nico Я бы предпочел использовать размещенную службу шрифтов, такую ​​​​как Google, если нужный вам шрифт есть или даже если есть тот, который близко соответствует. - person Moin Zaman; 20.10.2011
comment
Хорошо, так что это работает отлично! Спасибо! Я посмотрю, смогу ли я найти некоторые шрифты. Я собираюсь дать кому-то шанс ответить на мой первоначальный вопрос, но если ничего не поможет, я приму ваш ответ. - person Nico Huysamen; 20.10.2011

arrow_upward
2
arrow_downward

Вы можете поместить его в каталог web-app, это место для всех ваших статических ресурсов.

Вы можете создать каталог, например web-app/fonts, и указать его как /fonts/<you font> (работает, только если вы запускаете приложение в корневом контексте) или как ${resource(dir: 'fonts', file: '<your font>'}.

person Igor Artamonov    schedule 20.10.2011
comment
Не похоже на трюк, пожалуйста, проверьте мое обновление, может быть, я что-то упустил. - person Nico Huysamen; 20.10.2011
comment
Вы используете относительный путь, и в вашем случае ваш шрифт и css должны находиться в одном каталоге. Если вы поместите свой шрифт в корень каталога web-app, а css — в каталог css, вам придется использовать вместо него src: url('../myfont.ttf');. - person Igor Artamonov; 20.10.2011
comment
Нет, еще ничего. Но сейчас я использую хостинговое решение, оно работает безупречно. - person Nico Huysamen; 20.10.2011
comment
Нико, я подозреваю, что здесь все еще проблема с путем. Не могли бы вы использовать firebug и посмотреть, какой фактический путь используется? Если вы используете изображения в своем CSS, какие пути используются для них? - person Moin Zaman; 20.10.2011