为什么我的CSS在我的Rails应用程序上不起作用?

威力Q

我是Rails的新手,尽管正在寻找答案,但一直在努力解决此问题。

我已经创建了一个新应用,并且正在尝试将主题林引导模板迁移到该应用中。我以为这很简单,但到目前为止我失败了。

这些文件具有以下代码:

app / views / layouts / application.html.erb

<head>
  <!-- Meta Tags -->
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <!-- Title -->
  <title>Site</title>
  <!-- Fonts -->
  <link rel="stylesheet" type="text/css"  href='http://fonts.googleapis.com/css?family=Roboto:400,300,300italic,400italic,500,700,900,700italic,500italic'>
  <!-- Stylesheets -->
  <%= stylesheet_link_tag    'application', media: 'all', 'data-turbolinks-track' => true %>
  <%= javascript_include_tag 'application', 'data-turbolinks-track' => true %>

  <!--[if lt IE 9]>
  <script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
  <link rel="stylesheet" href="css/ie.css">
  <![endif]-->
  <!--[if IE 7]>
  <link rel="stylesheet" href="css/fontello-ie7.css">
  <![endif]-->
  <%= csrf_meta_tags %>
</head>

应用程序/资产/样式表/application.css

 *= require_self
 *= require_tree .
 *= require bootstrap.min
 *= require perfect-scrollbar
 *= require style
 *= require flexslider
 *= require fontello
 *= require animation
 *= require owl.carousel
 *= require owl.theme
 *= require chosen
 */

app / assets / javascripts / application.js

//= require_tree .
//= require modernizr.min
//= require jquery-1.11.0.min
//= require jquery-ui.min
//= require jquery.raty.min
//= require perfect-scrollbar.min
//= require zoomsl-3.0.min
//= require jquery.fancybox.pack
//= require jquery.themepunch.plugins.min
//= require jquery.themepunch.revolution.min
//= require flexslider.min
//= require jquery.iosslider.min
//= require jquery.nouislider.min
//= require owl.carousel.min
//= require chosen.jquery.min
//= require bootstrap.min
//= require turbolinks

由于某种原因,这无法加载我认为的bootstrap-min.js。

如果删除stylesheet_link_tag标签并替换application.html.erb文件中的css链接以反映以下内容,则可以使页面正常工作

<link rel="stylesheet" href="assets/bootstrap.min.css">
<link rel="stylesheet" href="assets/perfect-scrollbar.css">
<link rel="stylesheet" href="assets/style.css">
<link rel="stylesheet" href="assets/flexslider.css" type="text/css" media="screen" />
<link rel="stylesheet" href="assets/fontello.css">
<link rel="stylesheet" href="assets/animation.css">
<link rel="stylesheet" href="assets/owl.carousel.css">
<link rel="stylesheet" href="assets/owl.theme.css">
<link rel="stylesheet" href="assets/chosen.css"> 

我有种感觉,因为我不知道该怎么做,但请记住,我是新手,我必须从某个地方开始!

威力Q

我已经排序了!

我认为CSS中肯定有冲突。一世

 *= require_tree .

现在工作正常。我还发现JS出现问题,我也将其删除。

不知道这是否明智,但我欢迎任何建设性意见。

本文收集自互联网,转载请注明来源。

如有侵权,请联系 [email protected] 删除。

编辑于
0

我来说两句

0 条评论
登录 后参与评论

相关文章

角度引导问题angular.bootstrap在我的应用程序上不起作用

部分文字搜索(查找)在我的快速应用程序上不起作用

从Yahoo Finance下载并解析csv文件在我的Android应用程序上不起作用

$ scope在我的angularjs应用程序上不起作用

高程/阴影在我的应用程序上不起作用

为什么jQuery在我的Rails 5应用程序中不起作用?

如果函数在我的程序上不起作用

为什么我的 DataTrigger 在我的 Xamarin Forms 应用程序中不起作用?

为什么我的歌曲在我的 android 应用程序中不起作用?

为什么我的幻灯片在我的 React 应用程序中不起作用?

为什么我的D2XX应用程序在分叉时不起作用?

为什么 RoutingModule 在我的 angular 应用程序中不起作用?

为什么NSUserDefaults在我的应用程序和共享扩展之间不起作用?

为什么navigator.push在我的Flutter Web应用程序中不起作用?

为什么我运行应用程序时按钮不起作用?

为什么AOP在我的Spring Boot应用程序中不起作用?

为什么我的@Before注释在Spring应用程序中不起作用?

为什么相对图像路径在我的React应用程序中不起作用?

为什么我的测验应用程序中的问题之间的导航不起作用?

为什么我的全局样式在 vue.js 应用程序中不起作用

为什么我的C#应用程序不起作用?

为什么有些照片在我的android应用程序中不起作用

为什么“classList.add()”方法在我的 Vuetify 应用程序中不起作用?

试图弄清楚为什么我的反应应用程序不起作用

为什么 .env.development 在我的 Next.js 应用程序中不起作用?

为什么 onclick 功能在我的 Vue 应用程序中不起作用?

为什么 onFocus 和 onBlur 在我的 React 应用程序中不起作用

在我的Ionic应用程序上打开外部链接不起作用

在我的React本机应用程序上加载时路由不起作用