如何在 cakePhp 3 中使用 Open Sans 字体？

Question

我正在使用 cakePhp 3.0.4 构建我的应用程序。据我所知，cakePhp 3 使用 Zurb Foundation，我不明白如何更改默认字体（sans-serif）

默认字体在 base.css 文件第 11 行中指定：

/*  font-family: sans-serif; *//* 1 */
font-family: sans-serif;
  -ms-text-size-adjust: 100%; /* 2 */
  -webkit-text-size-adjust: 100%; /* 2 */

到目前为止我已经尝试过： 1.加载base.css第一行的字体：@import url(http://fonts.googleapis.com/css?family=Open+Sans);

2. 改变base.cssfont-family to 'Open sans', sans-serif;

我也试过了：

1. 加载default.ctp中的字体：

   $this->Html->css('http://fonts.googleapis.com/css?family=Open+Sans:300,400,700')

2. 将 base.css 字体系列更改为 'Open sans'、无衬线字体；

到目前为止没有成功。如何在cakePhp 3应用程序中正确使用Open sans字体？

谢谢。

Answer 1

您必须使用 font-family: 'Open Sans'; 而不是 font-family: 'Open-sans';

如果打开google字体的urlapi：

http://fonts.googleapis.com/css?family=Open+Sans:300,400,700

您必须使用的名称由

设置

@font-face {
  font-family: 'Open Sans';
  ...
}

Answer 2

Zurb版权评论后添加：

@import {url(fonts.googleapis.com/css?family=Open+Sans); }

然后在 Foundation 代码中找到每个实例：

font-family:"Helvetica Neue","Helvetica",Helvetica,Arial,sans-serif;

并将其更改为：

font-family:"Open Sans","Helvetica Neue","Helvetica",Helvetica,Arial,sans-serif;

我已经离开了 Helvetica，所以如果 Google 字体失败，它将回退到 Helvetica。

希望对您有所帮助。