Ruby on rails Rails应用程序处理CSS的方式不同吗？_Ruby On Rails_Ruby On Rails 3_Css

Ruby on rails Rails应用程序处理CSS的方式不同吗？

ruby-on-rails ruby-on-rails-3 css

Ruby on rails Rails应用程序处理CSS的方式不同吗？,ruby-on-rails,ruby-on-rails-3,css,Ruby On Rails,Ruby On Rails 3,Css,我有两套相同的html和css文件。其中一个是通过控制器通过Rails的index.html.erb文件加载的，其他的都是通过我的公用文件夹作为控件运行的。public index.html文件看起来很好：但是当我在rails index.html.erb文件中运行这些完全相同的文件时，它看起来是这样的：正如您可能会注意到的，在Rails构建中，BETA文本稍微低一些，显然导航列表位于MyHeader元素下面无可否认，我对css和rails都有点陌生，所以这可能是一个我不知道的已知问题。我

我有两套相同的html和css文件。其中一个是通过控制器通过Rails的index.html.erb文件加载的，其他的都是通过我的公用文件夹作为控件运行的。public index.html文件看起来很好：

但是当我在rails index.html.erb文件中运行这些完全相同的文件时，它看起来是这样的：

正如您可能会注意到的，在Rails构建中，BETA文本稍微低一些，显然导航列表位于MyHeader元素下面

无可否认，我对css和rails都有点陌生，所以这可能是一个我不知道的已知问题。我试图寻找一些见解，但没有发现任何类似的问题。如果有人能告诉我如何解决这个问题，我将非常感激

编辑：我将index.html和style.css文件包含在下面的粘贴箱中。它们很小，也许看看它们能给你们一些启示

HTML:

CSS:

编辑2：

在页面源中找到以下两行：

<link href="/assets/application.css?body=1" media="all" rel="stylesheet" type="text/css" />
<link href="/assets/home.css?body=1" media="all" rel="stylesheet" type="text/css" />

我认为可以安全地假设这些css文件中的某些内容导致了差异。我会调查并汇报

编辑3：

看起来这两个css文件实际上都没有任何作用。我将这两个文件的内容都包含在这个粘贴箱中：

正如你所看到的，这只是评论的东西。但是我注意到，页面源代码在同一个文件中包含2个html标记。我也将其粘贴在一起：

就这样

<html>//rails generated stuff</html> 
<html>//My stuff</html>

这可能是问题的原因吗？

CSS是在浏览器中解释的，而不是在服务器上解释的，因此简单的答案是否定的。但是，当您的样式添加到Rails应用程序本身包含的任何样式中时，可能会有不同的解释，并且您的HTML可能在两者之间有点不同。检查Rails应用程序中包含的CSS，取出任何会对您的设计产生不利影响的内容，或者干脆将其全部删除，确保您的CSS文件是整个代码库中唯一的一个。CSS在浏览器中解释，而不是在服务器上解释，所以简单的答案是否定的。但是当你的样式被添加到Rails应用程序本身包含的任何样式中时，你的样式可能会有不同的解释，并且你的HTML可能在两者之间有点不同。检查Rails应用程序中包含的CSS，取出任何会对您的设计产生不利影响的内容，或者干脆将其全部删除，确保您的CSS文件是整个代码库中唯一的一个。

关于编辑3：看起来它来自app/views/layouts/application.html.erb中的默认布局。默认情况下，Rails将加载该文件，并将指定视图中的所有内容放在指定的位置。如果视图文件中有其他等标记，它们将被复制。您可以了解有关布局的更多信息。另外，请看一看如何在应用程序中构造CSS文件

正如Ernest所说，Rails只是提供HTML/CSS文件，因此框架本身并不影响浏览器呈现内容的方式。但是，向浏览器显示内容的顺序当然很重要。

正如Ernest所说，Rails只是提供HTML/CSS文件，因此框架本身并不影响浏览器呈现内容的方式。但是，内容呈现给浏览器的顺序当然很重要。

解决此类问题的最简单方法是：检查

使用浏览器的检查器检查影响给定元素的CSS规则。假设你使用谷歌浏览器，你可以：

右键单击其中一个导航栏项目，选择“检查图元” 然后在新的源代码窗口中选择.logo container或.nav 检查右边的面板：您将看到该元素当前应用的所有CSS规则。您还将看到哪个文件正在应用哪个规则。 ??? 利润

解决此类问题的最简单方法是：检查

使用浏览器的检查器检查影响给定元素的CSS规则。假设你使用谷歌浏览器，你可以：

html文件100%相同，css文件是项目中包含的文件。这是两者之间的直接复制和粘贴，唯一的区别是

名为index.html，另一个名为index.html.erb，没有其他CSS文件？如果在浏览器中使用view source，Rails是否在HTML中插入了指向另一个源的链接？啊！看来我找到什么了。我将把它添加到可读性问题中。试着通过Firebug或Chrome工具来查看继承的样式。有时可能有一些元素是/是从另一个CSS继承而来的。在我的业务中发现了两个rails生成的CSS文件，我会在发现它们是否有影响时更新问题。html文件是100%相同的，CSS文件是项目中包含的文件。这是两者之间的直接复制和粘贴，唯一的区别是一个名为index.html，另一个名为index.html.erb，没有其他CSS文件？如果在浏览器中使用view source，Rails是否在HTML中插入了指向另一个源的链接？啊！看来我找到什么了。我将把它添加到可读性问题中。试着通过Firebug或Chrome工具来查看继承的样式。有时可能有一些元素是/是从另一个CSS继承的。发现两个rails生成的CSS文件在我的业务中占了上风，当我发现有什么影响时，我会更新这个问题。我将css文件添加到资产管道中，而不是公共/样式表中，问题就解决了。我不会问得太深，只是在这一点上感谢lolI将css文件添加到资产管道中，而不是公共/样式表，问题就解决了。我不会问得太深，只是在这一点上要心存感激lol