Question

在我的Rails 4应用程序中，我正在尝试实现一个条件来为Internet Explorer VS加载不同的样式表。其他浏览器。

我有app/views/layout/_header.html.erb部分：

<head>
  <%= stylesheet_link_tag 'application', media: 'all', 'data-turbolinks-track' => true %>
  <!--[if !IE]><!-->
    <%= stylesheet_link_tag 'application', media: 'all', 'data-turbolinks-track' => true %>
    <%= stylesheet_link_tag 'ie', media: 'all', 'data-turbolinks-track' => true %>
  <!--<![endif]-->
  <%= javascript_include_tag 'application', 'data-turbolinks-track' => true %>
  <%= csrf_meta_tags %>
</head>

我在app/assets/stylesheets中有以下样式表：

custom / # with all my model-specific stylesheets here, such as posts.scss
application.scss
custom.scss
ie.scss

在application.scss我有：

@import "bootstrap-sprockets";
@import "bootstrap";
@import "bootstrap/theme";
@import "bootstrap-datetimepicker";
@import "font-awesome-sprockets";
@import "font-awesome";
@import "simple_calendar";
@import "custom.scss";
@import "custom/**/*";

注意 ：ie.scss中特定于IE的规则非常轻，少于20行代码。

但是，当我在Internet Explorer中启动应用时，不会考虑来自ie.scss的CSS规则。

当用户在Internet Explorer中启动应用程序时，如何加载ie.scss文件？

Answer 1

对于所有IE版本：

<%= stylesheet_link_tag 'application', media: 'all', 'data-turbolinks-track' => true %>
<!-- Calling application stylesheet file only once -->
<!--[if IE]> 
  <%= stylesheet_link_tag 'ie', media: 'all', 'data-turbolinks-track' => true %> 
<![endif]-->

而不是指定ie.css，您可以将其更改为：

Rails.application.config.assets.precompile += %w( *.css )

这样您就不必单独添加每个文件。我通常在我的项目中使用的内容：

Rails.application.config.assets.precompile += %w( *.js *.css *.png *.jpg *.jpeg )

Rails 4 x SASS：在Internet Explorer中加载特定的样式表

1 个答案: