Css 在Rails应用程序中包含Google字体_Css_Ruby On Rails

Css 在Rails应用程序中包含Google字体

css ruby-on-rails

Css 在Rails应用程序中包含Google字体,css,ruby-on-rails,Css,Ruby On Rails,有人知道我如何在rails应用程序中包含google字体样式表吗？我试着添加 <link href='https://fonts.googleapis.com/css?family=Raleway:500,900,200' rel='stylesheet' type='text/css'> 进入我的application.html.erb但那没有任何作用您确定要将放入您想要的布局中吗在各自的.css样式表中，您是否放置了字体系列：Raleway 一定要弄清楚。谢谢。app

有人知道我如何在rails应用程序中包含google字体样式表吗？我试着添加

<link href='https://fonts.googleapis.com/css?family=Raleway:500,900,200' 
rel='stylesheet' type='text/css'>

进入我的

application.html.erb

但那没有任何作用

您确定要将

放入您想要的布局中吗

在各自的

.css

样式表中，您是否放置了

字体系列：Raleway
一定要弄清楚。
谢谢。
application.html.erb
<!DOCTYPE html>
<html>
<head>
<title>Title</title>
<%= stylesheet_link_tag    "application", :media => "all" %>
 <%= javascript_include_tag "application" %>
<%= csrf_meta_tags %>

 <!-- Google font -->
<link href='http://fonts.googleapis.com/css?family=Ubuntu' rel='stylesheet' type='text/css'>

</head>
<body>
 ............

我这样用，也许这会澄清
更新
尝试删除scaffold.css.scss！或者只需打开并注释掉该文件CSS的所有主体部分。
对于外部样式表，将其添加到布局中（application.html.erb）
如果您使用

1)
轨道布局中的

(二)
在样式表中使用请求的web字体为元素设置样式：
CSS selector {
  font-family: 'Font Name', serif;
}

或者在元素本身上使用内联样式：
你的文字
您得到了字体系列橘子色

例如：--

身体{
字体系列：“橘黄色”，衬线；
字体大小：48px；
}
让网络变得美丽！
将其粘贴在application.html.erb的头部部分
我一直在挣扎，因为我有这样一句话：
<%= stylesheet_link_tag 'application', 
media: 'all', 'data-turbolinks-track' => true %>

然后像往常一样在样式表中使用字体族属性
当然，我们可以在SASS中@import它，或者像往常一样使用链接标签，但这只是另一种方式，应该在这里提及。
我认为最综合的方式是编辑app/assets/views/application.html.erb并更改：
<%= stylesheet_link_tag 'application.css' %>



到

如果您通过@import添加字体，如其他注释所示，在application.css中的@import Bootstrap下，资产管道会将其编译到应用程序样式表中。如果将它作为链接放在html的头部，它将作为一个单独的样式表添加，从而降低页面加载速度。您可以添加@import代码，就像谷歌从谷歌字体网站上选择的字体中提供的一样。
只需将谷歌提供的代码添加到application.scss文件的顶部即可
@导入url（'https://fonts.googleapis.com/css?family=Quicksand|魔方'
请注意，rails将为您提供带有require语句的开箱即用的application.css文件。删除这些并重命名application.scss
记住添加@import文件名；对于文件夹中的任何其他自定义SCSS文件
在application.html.erb中的head和CSS字体系列中添加提供的链接：“font Name”，草书；可能您的字体CSS是字体系列：“Raleway”，无衬线；对不起，我不明白你的意思！我只是想澄清一下——我知道如何正常使用CSS和谷歌字体，但事实是我使用的是Rails，这才是问题最终解决的原因，当然这也是我自己的愚蠢。是css文件的顺序导致了这个问题，因此编辑application.css文件超出了顺序。再次澄清——我的问题不是如何使用Google字体——而是我如何在Rails应用程序中引用外部样式表。你可以访问任何外部样式表样式表\u链接\u标记“应用程序”，“放置外部样式表的链接”
感谢您的帮助，但不知什么原因，字体不会显示在我的html页面上！奇怪，因为他们在我的老妈妈身上工作得很好。嗯，这对我来说不起作用。我已经看过了源代码和参考文件，但没有效果！application.css是一个清单文件，不应该包含样式。这可以工作，但看起来不太正常。。？我怎样才能重新考虑这个问题呢？你的答案应该是公认的解决方案，因为在国际海事组织，这是正确的解决方法。这个技巧非常重要！谢谢分享！我认为这是最好的方法，字体不属于application.html.erb
。更好的是，您可以制作一个font.scss
，导入所有需要的字体，然后将其包含在application.scss中，这样您就有了一个小小的字体清单
<html>
  <head>
   <link rel="stylesheet" type="text/css" href="http://fonts.googleapis.com/css?family=Tangerine">
   <style>
     body {
      font-family: 'Tangerine', serif;
      font-size: 48px;
     }
</style>
 </head>
<body>
  <div>Making the Web Beautiful!</div>
</body>
</html>

<link href='https://fonts.googleapis.com/css?family=Raleway:500,900,200' 
rel='stylesheet' type='text/css'>

body{
  font-family: "Raleway", Arial, sans-serif;
}

<%= stylesheet_link_tag 'application', 
media: 'all', 'data-turbolinks-track' => true %>

<%= stylesheet_link_tag 'application',
'https://fonts.googleapis.com/css?family=Open+Sans:400&subset=latin',
 media: 'all', 'data-turbolinks-track' => true %>

<%= stylesheet_link_tag 'application.css' %>

<%= stylesheet_link_tag 'https://fonts.googleapis.com/css?family=Catamaran','application.css' %>