DEFER or ASYNC allowed on a stylesheet include?

html css asynchronous deferred-loading
Doug picture Doug · Sep 17, 2014 · Viewed 50.1k times · Source

I know script files can use the DEFER and ASYNC keywords on a resource include. Do these keywords also work for stylesheet (i.e., CSS) includes?

Syntax would presumably be:

<link rel="stylesheet" type="text/css" href="./path/to/style.css" defer />

I just don't know if it's allowed or not.

Answer

fmsf picture fmsf · Sep 17, 2014

Defer and Async are specific attributes of the tag <script> https://developer.mozilla.org/en/docs/Web/HTML/Element/script

They will not work in other tags, because they don't exist there. A stylesheet is not a script that contains logic to be executed in parallel or after the loading. A stylesheet is a list of static styles that get applied atomically to html.

Related questions

How to load CSS Asynchronously

I'm trying to eliminate 2 CSS files that are render blocking on my site - they appear on Google Page Speed Insights. I have followed different methods, none of which were a success. But, recently, I found a post about Thinking …

Read More
How to horizontally center a <div>

How can I horizontally center a <div> within another <div> using CSS? <div id="outer"> <div id="inner">Foo foo</div> </div>

Read More
How do I vertically center text with CSS?

I have a <div> element which contains text and I want to align the contents of this <div> vertically center. Here is my <div> style: #box { height: 170px; width: 270px; background: #000; font-size: 48px; color: #…

Read More