Я для этого сделала примесь:
.font(@fontName; @urlName: @fontName; @weight: normal; @style: normal) {
font-family: '@{fontName}';
src: url('/fonts/@{urlName}/@{urlName}.eot');
src: url('/fonts/@{urlName}/@{urlName}.eot#iefix') format('embedded-opentype'),
url('/fonts/@{urlName}/@{urlName}.woff') format('woff'),
url('/fonts/@{urlName}/@{urlName}.ttf') format('truetype'),
url('/fonts/@{urlName}/@{urlName}.svg') format('svg');
font-weight: @weight;
font-style: @style;
}
Потом вызываю её:
@font-face {
.font(@fontRegular);
}
@font-face {
.font(@fontRegular; @fontBold; bold);
}
Предварительно задав переменные с необходимыми шрифтами:
@fontRegular: 'OpenSans';
@fontBold: '@{fontRegular}-Bold';
На выходе получаю готовый CSS =)
@font-face {
font-family: 'OpenSans';
src: url('/fonts/OpenSans/OpenSans.eot');
src: url('/fonts/OpenSans/OpenSans.eot#iefix') format('embedded-opentype'),
url('/fonts/OpenSans/OpenSans.woff') format('woff'),
url('/fonts/OpenSans/OpenSans.ttf') format('truetype'),
url('/fonts/OpenSans/OpenSans.svg') format('svg');
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: 'OpenSans';
src: url('/fonts/OpenSans-Bold/OpenSans-Bold.eot');
src: url('/fonts/OpenSans-Bold/OpenSans-Bold.eot#iefix') format('embedded-opentype'),
url('/fonts/OpenSans-Bold/OpenSans-Bold.woff') format('woff'),
url('/fonts/OpenSans-Bold/OpenSans-Bold.ttf') format('truetype'),
url('/fonts/OpenSans-Bold/OpenSans-Bold.svg') format('svg');
font-weight: bold;
font-style: normal;
}
Вот, собственно, и всё) Может кому будет полезно.
