样式表不适用于sinatra erb视图 [英] Stylesheet not applying to sinatra erb views

问题描述

我的样式表适用于应用程序的某些元素，而不适用于其他元素，我不确定为什么.

My stylesheet is applying to some elements of my app and not others, and I'm not sure why.

这是我的文档结构:

当前，样式表将应用于index.erb和contacts.erb，但不适用于树中的其他样式，我不确定为什么.

Currently, the stylesheet is being applied to index.erb and contacts.erb, but not the others in the tree, and I'm not sure why.

在我的布局中，我指定了:< link rel ="stylesheet" type ="text/css" href ="style.css">

In my layout I've specified: <link rel="stylesheet" type="text/css" href="style.css">

有什么想法吗?

推荐答案

您正在使用对样式表的相对引用，因此浏览器将相对于当前URL进行请求.这意味着对于/和/contacts ，浏览器将请求/styles.css 并找到它，但是例如，/contacts/1 ，它将请求不存在的/contacts/style.css .如果您查看日志，那么很可能会看到404错误.

You are using a relative reference to your stylesheet, so the browser will request it relative to the current url. This means for / and /contacts the browser will request /styles.css and so find it, but for example /contacts/1 it will request /contacts/style.css which doesn’t exist. If you check your logs you’ll likely see a load of 404s where this has happened.

解决方案是为样式表使用绝对路径.假设您的应用程序已安装在服务器的根目录下(即，例如对 http://example.com/contacts/1 的请求)，则只需添加/到 href 的开头:

The solution is to use an absolute path for your stylesheet. Assuming you app is mounted at the root of you server (i.e. requests are made to e.g. http://example.com/contacts/1) you can do this by just adding a / to the beginning of the href:

<link rel="stylesheet" type="text/css" href="/style.css">

更强大的解决方案是使用 url 助手，即使您的应用安装在其他位置(例如在Rails应用中)或位于代理后面，也可以确保使用正确的url:

A more robust solution would be to use the url helper, which will ensure the correct url will be used even if your app is mounted at another point (e.g. within a Rails app) or is behind a proxy:

<link rel="stylesheet" type="text/css" href="<%= url("/style.css")%>">

这篇关于样式表不适用于sinatra erb视图的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！