CODEWITHSUNDEEP
javascripthtmlcss
sdvnksv
sdvnksv

Reputation: 9668

Is it valid to put stylesheets before the closing body tag if using critical CSS in the head?

I have to follow a Google advice to first load critical CSS inline in the header then load other styles. Some articles advise to load other styles asynchronously with the help of JS. However, I wonder whether I can simply place them before the closing body tag. Is it going to affect rendering negatively (taken that the above the fold styles are already loaded)?

<html>
  <head>
    <style>
      <!-- Critical CSS goes here to display what's above the fold -->
    </style>
  </head>
  <body>
    ...
    <link rel="stylesheet" ... >
  </body>
</html>

Upvotes: 3

Views: 777

Answers (1)

Daniel Beck
Daniel Beck

Reputation: 21475

In HTML5.0 the <link> element is only allowed in the <head>:

If the rel attribute is used, the element is restricted to the head element.

(Note also the previous line: "A link element must have a rel attribute".)

But the HTML5.2 working draft relaxes this requirement:

Keywords that are body-ok affect whether link elements are allowed in the body. The body-ok keywords defined by this specification are prefetch, and stylesheet.

Upvotes: 4

Related Questions