How to Add CSS to HTML

Cascading Style Sheets (CSS) can be added to HTML documents in three ways: inline, internal, or external.

Each way has its own purpose and benefits. Here is a breakdown of how to use each method.

Method 1: Inline CSS

The inline method involves adding CSS directly to an HTML element using the style attribute.

This is useful for applying styles to a single element, but it is generally not recommended for styling the whole webpage as it is hard to maintain.

Method 2: Internal CSS

The internal method involves putting all your CSS rules inside the head section of your HTML document, wrapped in style tags.

This is useful if you want to style an entire page at once, but only that specific page.

Method 3: External CSS

The external method is the most efficient way to style a whole website. You put all your CSS rules in a separate file (with a .css extension) and then link to it from your HTML document.

To do this, use the link tag inside the head of your HTML file.

The HTML File

The CSS File (style.css)