jquery - 对更新的 CSS 文件所做的更改不会生效

Question

我的 ROR 应用程序中有以下 haml 文件，我正在尝试通过 CSS 为 #index_orders 下的文本部分实现排版和字体更改。但是，当我实现以下更改时，特别是在 CSS 文件中，刷新我的开发环境 (localhost:3000) 时没有任何效果。

下面是包含适当嵌套和间距的 haml 文件:

index.html.haml

<div class="jumbotron">
%h1 <center><font color ="#c0392b"><i>Hello World!</i></font>
<center>
%br/
%h3 Some Generic Message, Woot! :)
%br/
<a class="btn btn-danger btn-lg" href="#" role="button">Sign Up</a>

#index_orders
  - @orders.each do |order|
      %h3= link_to order.date.strftime("%A %B %d, %Y"), order
      %h4= order.name

现在这是带有相关代码的应用程序 CSS 文件的选择部分:

应用程序.css.scss

#index_orders {
    h2 {
        margin-bottom: 0;
        font-weight: 100;
            a {
               color: white;
            }
        }
    }

为什么字体颜色/排版更改没有生效？

非常感谢!

Answer 1

样式规则仅针对 h2 元素。由于您的 index.html.haml 中没有 h2 元素，您将看不到预期的视觉变化。

要查看应用的样式规则，请更改 application.css.scss 中的 h2 选择器以定位所需的 h1 或 h3 元素。

例如，

#index_orders {
    h3 {
        margin-bottom: 0;
        font-weight: 100;
            a {
               color: white;
            }
        }
    }