What is the preferred way of including CSS within a project? How do I know when to Use inline styles, the <style> tags, or a .css file?

Frequently Asked Questions CSS FAQ
1

Question

What is the preferred way of including CSS within a project? How do I know when to
Use inline styles, the tags, or a .css file?

Answer

As a web developer you will eventually come across HTML documents which include CSS either inline with style attributes or within the <style> tags at the head of the document. Hence, it is important to be aware of all the various ways to include CSS in a project.

That having been said, mashing HTML and CSS together is not a great habit to get into. As developers we want to “separate our concerns” because this usually creates codebases that are more flexible, readable, and maintainable. As such, keeping our CSS contained within a separate .css file is the preferred way of including CSS within most projects.
For a deeper dive into some of the nuances here, take a look at this article.

25 Likes
6

It would be nice if you could add to “the new css file” the information that it is found above the code interface next to the index.html file. I know this might seem obvious but to the visually impaired, i.e. code/text/ focused I did not understand where that file was located in virtual space… and was searching for it in the code itself. :slight_smile:

17 Likes
11

@alyssavigil, still as important a concern today as when this was first posted.

4 Likes