Comparison of loading CSS inline, embedded and from external files

Question

We can write CSS as the following types:

1. Inline CSS
2. Embedded CSS
3. External CSS

I would like to know pros and cons of each.

Answer 1

Inline CSS is generally bad. It's much easier to modify the style of a page when all the styles are located in one central location, which inline CSS doesn't offer. It's easy for quickly prototyping styles, but shouldn't be used in production, especailly since it often leads to duplicating styles.

Embedded CSS centralizes the styles for the page, but it doesn't allow you to share styles across pages without copying the text of the embedded style and pasting it in each unique page on your site.

External CSS is the way to go, it has all of the advantages of embedded CSS but it allows you to share styles accross multiple pages.