使用与twitter bootstrap不同的字体

Question

我想为我的网站使用不同的字体,这不是常规的webfont.我已经创建了EOT文件.现在我如何将这些字体与twitter bootstrap集成？有人可以帮忙吗？

谢谢

Answer 1

我见过的最简单方法是使用Google字体.

转到Google字体并选择字体,然后Google会为您提供放入HTML的链接.

然后将其添加到custom.css:

h1, h2, h3, h4, h5, h6 {
    font-family: 'Your Font' !important;
}
p, div {
    font-family: 'Your Font' !important;
}

要么

body {
   font-family: 'Your Font' !important;
}

Answer 2

你可以在官方网站上找到一个定制器,它允许你设置一些LESS变量,如@font-family-base.在布局中链接自定义字体,并使用自定义生成的引导程序样式.

链接在这里

有关@font-face规则的示例,使用WOFF格式(这非常适合浏览器兼容性),请在您的app.css文件中添加此CSS 并包含您的自定义boostrap.css文件.

@font-face {
  font-family: 'Proxima Nova';
  font-style:  normal;
  font-weight: 400;
  src: url(link-to-proxima-nova-font.woff) format('woff');
}

请注意,Proxima Nova是获得许可的.

Answer 3

您可以自定义 twitter bootstrap css 文件，bootstrap.css在文本编辑器上打开该文件，然后使用您的字体名称更改字体系列并保存。

或者访问http://getbootstrap.com/customize/并制作自定义的 twitter bootstrap