样式表不适用于sinatra erb视图

Question

我的样式表适用于我的应用的某些元素，而不适用于其他元素，我不确定原因。

这是我的文档结构：

目前，样式表正在应用于index.erb和contacts.erb，而不是树中的其他样式表，我不确定原因。

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

有什么想法吗？

Answer 1

您正在使用样式表的相对引用，因此浏览器将相对于当前URL请求它。这意味着对于/和/contacts，浏览器会请求/styles.css，因此找到它，但例如/contacts/1它将请求/contacts/style.css不存在。如果你检查你的日志，你可能会看到404负载发生这种情况。

解决方案是使用样式表的绝对路径。假设您的应用程序已安装在服务器的根目录上（即请求发送到http://example.com/contacts/1），您可以通过在/的开头添加href来实现此目的：

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

更强大的解决方案是使用url helper，这将确保即使您的应用程序安装在另一个点（例如在Rails应用程序中）或在代理服务器后面，也将使用正确的URL：< / p>

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

Answer 2

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

公共文件夹始终用于存储css，js文件，一旦进入生产环境，它将存储在浏览器的缓存中