如何在 ruby​​ on rails 应用程序中使用 CSS？

How do I use CSS with a ruby on rails application?

提问by Stefan Kendall

How do I use CSS with RoR? When I link externally, I'm never able to see the files. I cp'd the .css file to every folder I could think of...views, controller, template, and nothing seems to work.

如何将 CSS 与 RoR 结合使用？当我从外部链接时，我永远无法看到这些文件。我将 .css 文件复制到我能想到的每个文件夹中……视图、控制器、模板，但似乎没有任何效果。

What do I need to do to enable external CSS files with a rails application? I'm new to rails, so forgive me if this is basic.

我需要做什么才能使用 rails 应用程序启用外部 CSS 文件？我是 Rails 的新手，所以如果这是基本的，请原谅我。

采纳答案by Kyle Boon

Put the CSS files in public/stylesheets and then use:

将 CSS 文件放在 public/stylesheets 中，然后使用：

<%= stylesheet_link_tag "filename" %>

to link to the stylesheet in your layouts or erb files in your views.

链接到布局中的样式表或视图中的 erb 文件。

Similarly you put images in public/images and javascript files in public/javascripts.

同样，您将图像放在 public/images 中，将 javascript 文件放在 public/javascripts 中。

回答by sameera207

If you are using rails > 3 version, then there is a concept called asset pipeline. You could add your CSS to

如果您使用的是 rails > 3 版本，那么有一个概念叫做asset pipeline. 你可以将你的 CSS 添加到

app/assets/stylesheets

then it will automatically be picked up by the app. (this is useful as rails will automatically compress the CSS files)

然后它会被应用程序自动拾取。（这很有用，因为 rails 会自动压缩 CSS 文件）

read more hereabout the asset pipeline

在此处阅读有关资产管道的更多信息

回答by Sparta Newton Robert

Use the rails style sheet tag to link your main.css like this

使用 rails 样式表标签来链接你的 main.css 像这样

<%= stylesheet_link_tag "main" %>

Go to

去

config/initializers/assets.rb

Once inside the assets.rbadd the following code snippet just below the Rails.application.config.assets.version = '1.0'

进入后，在assets.rb下方添加以下代码片段Rails.application.config.assets.version = '1.0'

Rails.application.config.assets.version = '1.0'
Rails.application.config.assets.precompile += %w( main.css )

Restart your server.

重新启动您的服务器。

回答by Jim Chertkov

I did the following...

我做了以下...

1. place your css file in the app/assets/stylesheetsfolder.
2. Add the stylesheet link <%= stylesheet_link_tag "filename" %>in your default layouts file (most likely application.html.erb)

1. 将您的 css 文件放在app/assets/stylesheets文件夹中。
2. <%= stylesheet_link_tag "filename" %>在默认布局文件中添加样式表链接（很可能application.html.erb）

I recommend this over using your public folder. You can also reference the stylesheet inline, such as in your index page.

我建议不要使用您的公用文件夹。您还可以内联引用样式表，例如在您的索引页中。

回答by CodeJohnny

The original post might have been true back in 2009, but now it is actually incorrect now, and no linking is even required for the stylesheet as I see mentioned in some of the other responses. Rails will now do this for you by default.

最初的帖子在 2009 年可能是正确的，但现在它实际上是不正确的，而且我在其他一些回复中看到的样式表甚至不需要链接。默认情况下，Rails 现在会为您执行此操作。

• Place any new sheet .css (or other) in app/assets/stylesheets
• Test your server with rails-root/scripts/rails server and you'll see the link is added by rails itself.

• 将任何新表 .css（或其他）放在 app/assets/stylesheets
• 用 rails-root/scripts/rails server 测试你的服务器，你会看到链接是由 rails 本身添加的。

You can test this with a path in your browser like testserverpath:3000/assets/filename_to_test.css?body=1

您可以使用浏览器中的路径进行测试，例如 testserverpath:3000/assets/filename_to_test.css?body=1

回答by Raphomet

To add to the above, the most obvious place to add stylesheet_link_tag is in your global application layout - application.html.erb.

要添加到上面，添加 stylesheet_link_tag 最明显的地方是在您的全局应用程序布局中 - application.html.erb。

回答by swiches

With Rails 6.0.0, create your "stylesheet.css" stylesheet at app/assets/stylesheets.

使用 Rails 6.0.0，在app/assets/stylesheets创建“stylesheet.css”样式表。

回答by Chris Bunch

Have you tried putting it in your public folder? Whenever I have images or the like that I need to reference externally, I put it all there.

你有没有试过把它放在你的公用文件夹中？每当我有需要从外部引用的图像或类似内容时，我都会把它们都放在那里。