Question

我正在使用Zurb Foundation并需要显示一些法语段落。我正在使用可以正确显示法语字符的Lato Google字体。但目前我得到以下内容：
加拿大魁北克省Boucherville est une ville danslarégiondelaMontérégieau。出现这种情况：
加拿大魁北克省Boucherville est une ville danslar giondelaMont r gieau。

有关如何确保法语拉丁字符在Foundation中正确显示的任何见解？

以下是website page

点击 BouchervilleMap 菜单项查看有问题的代码

Answer 1

我无法在您的标记中看到您自己的个人CSS样式表，请您发布。

根据我在标记中看到的内容，我认为您的问题即使您链接到您的字体，也不会告诉页面何时或何时使用它。您链接的所有CSS都是CDN，因此它们显然是使用其他英文字符的标准模板。

我做什么来覆盖基金会是我有一个我最后调用的FoundationOverides.css你可以做同样的事情并且有类似的东西：

@import url('http://fonts.googleapis.com/css?family=Lato');
body{
font-family: "Lato, Helvetica Neue", "Helvetica", Helvetica, Arial, sans-serif;  
}

button, .button {
font-family: "Lato, Helvetica Neue", "Helvetica", Helvetica, Arial, sans-serif;  
}
// And so on...

我建议下载一份Foundation.css，在文本编辑器中打开它并搜索这一行：

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

然后将所有选择器逐个复制到覆盖CSS中。在提到13次时会有痛苦，但是一旦你完成了它就完成了。

然后在你的html中确保你最后包含你的覆盖：

<head>
  <meta charset="utf-8" />
  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
   <title>Boucherville Quebec</title>
   <link rel="stylesheet" type="text/css" href="http://cdn.jsdelivr.net/jquery.slick/1.3.7/slick.css"/>
   <link href='http://fonts.googleapis.com/css?family=Lato' rel='stylesheet' type='text/css'>
   <link rel="stylesheet" href="http://cdn.jsdelivr.net/foundation/5.3.3/css/foundation.min.css" />
   <link href="http://cdnjs.cloudflare.com/ajax/libs/foundicons/3.0.0/foundation-icons.css" rel="stylesheet" />
   <script src="http://cdn.jsdelivr.net/foundation/5.3.3/js/vendor/modernizr.js"></script>


   <link href="pathtoyour/css/FoundationOverride.css" rel="stylesheet" />


</head>

Get Foundation Zurb 5展示法国角色

1 个答案: