Why would you use link tags with a data/css HREF instead of using a style tag?

781 Views Asked by At

In Facebook's source code, you can find the following source code which I'm having to post as a link instead of an image as I'm new to the site.

For reference, it's a HTML <link> tag with the href property beginning with data:text/css; charset=utf-8, with CSS then following on.

Why would you use that tag over a <style> tag which is designed for storing and using CSS?

1

There are 1 best solutions below

3
On

https://www.w3.org/TR/html5/document-metadata.html#the-link-element

https://www.w3.org/TR/html5/document-metadata.html#the-style-element

The difference between the two is that you can re-use a link to a .css in many different pages where a style block would have to be written on every single page. A site that has many different pages would rather link to a .css and keep all the pages looking the same than have to re-write the Style block over and over. <link href="#" rel="stylesheet" /> --> goes and gets an already written .css file. div{ border:1px solid black; }

--> is written on the page and it's scope is only to that single page.