Question

我正在尝试按照此google页面中的建议优化CSS Delivery：

https://developers.google.com/speed/docs/insights/OptimizeCSSDelivery

然而，我甚至无法在Jade中重建他们的基本例子。以下代码不起作用：

html
  head
    title= title
    meta(name='viewport' content='width=device-width, initial-scale=1.0')
    style(type='text/css')
        .blue{color:blue};
  body
    nav(class='navbar navbar-default navbar-fixed-top')
    p(class='blue') test

p标签没有拾取我在样式标签中指定给.blue的样式。这种类型的内联CSS是否可以与Jade一起使用？

Answer 1

你尝试过使用！important吗？

html
  head
    title= title
    meta(name='viewport' content='width=device-width, initial-scale=1.0')
    style(type='text/css')
         .blue{color:blue !important};
 body
   nav(class='navbar navbar-default navbar-fixed-top')
    p(class='blue') test

Answer 2

您无法缩进样式。这有效：

html
   head
   title= title
   meta(name='viewport' content='width=device-width, initial-scale=1.0')
   style(type='text/css').blue{color:blue};
 body
   nav(class='navbar navbar-default navbar-fixed-top')
   p(class='blue') test

内联CSS无法使用jade

2 个答案: