DEFER or ASYNC allowed on a stylesheet include?

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.

You could do this:

<link rel="stylesheet" href="/css/style.css" media="none" onload="if(media!=='all')media='all'" >

and create a noscript fallback

As of Jan 2019, this StackOverflow post still ranks #1 in some Google searches. Therefore, I am submitting this very late answer for those who land here seeking to defer the loading of your CSS.

Credit: https://www.giftofspeed.com/defer-loading-css/

The gist

Add the following above the closing </body> tag of your html document

<script type="text/javascript">
  /* First CSS File */
  var giftofspeed = document.createElement('link');
  giftofspeed.rel = 'stylesheet';
  giftofspeed.href = '../css/yourcssfile.css';
  giftofspeed.type = 'text/css';
  var godefer = document.getElementsByTagName('link')[0];
  godefer.parentNode.insertBefore(giftofspeed, godefer);

  /* Second CSS File */
  var giftofspeed2 = document.createElement('link');
  giftofspeed2.rel = 'stylesheet';
  giftofspeed2.href = '../css/yourcssfile2.css';
  giftofspeed2.type = 'text/css';
  var godefer2 = document.getElementsByTagName('link')[0];
  godefer2.parentNode.insertBefore(giftofspeed2, godefer2);
</script>