在 Rails 4 中使用 turbolinks 时 css 样式覆盖

标签 css ruby-on-rails turbolinks

我在我的 rails4 元素中使用了 turbolinks。

我注意到它会将所有 *.css 文件添加为 html head 中的外部 css 链接。 如果有人使用与我相同的 css 选择器,css 样式可能会被覆盖!

这是我的问题: turbolinks 中是否有任何设置可以忽略指定页面上的某些 css/js 加载?

最佳答案

我会说这是有条件的工作 ERB代码,而不是 turbolinks(但我可能是错的)

Turbolinks是一个加载 <body 的 javascript 库> 通过 ajax 标记页面(保持 <head> 完整。您可以通过将 data-no-turbolink 标记应用到您的链接来独立加载 Turbolinks:

<div id="some-div" data-no-turbolink>

我会这样做:

<head>
   <% if x.present? %>
       <%= stylesheet_link_tag "your_css" %>
   <% end %>
</head>

具体 Assets /样式方面,不妨看看asset change detection :

You can track certain assets, like application.js and application.css, that you want to ensure are always of the latest version inside a Turbolinks session. This is done by marking those asset links with data-turbolinks-track


最后,您的问题非常模棱两可(上下文不够)。当你提到:

I notice it will add all *.css file as external css link in html head. Css style may be overwrite if someone uses the same css selector as I do!

如果您的 CSS 是 spaghetti code ,您的问题可能与您构建 Assets 的方式有关,而不是 Turbolinks。你应该提供更多关于你如何加载你的 CSS 以及它需要带回什么的细节

关于在 Rails 4 中使用 turbolinks 时 css 样式覆盖,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/22656554/

相关文章:

html - CSS - 表格模式如何正确显示?

javascript - 如何在新浏览器中隐藏或更改鼠标光标?

css - 只有一个滚动条工作

javascript - 使用多个 jQuery-minicolors 样本更改多个 div 容器的背景颜色

ruby-on-rails - Ruby on Rails 允许对 RSpec 测试进行批量分配

javascript - 铁路之路 : Send client data to controller using turbolinks

html - 如何使用 Google Chrome 扩展程序向图像添加 HTML 链接?

ruby-on-rails - 生成电子邮件地址图像或其他不易被抓取的内容

ruby-on-rails - Turbolinks Rails 5的浏览器后退按钮上的JQuery插件初始化

ruby-on-rails - 检查窗口后执行脚本