Inline CSS

Inline styles are exactly as they sound – styling within your HTML document.

While in the early days this may have made sense, we strongly suggest separating HTML code and Styling.

Inline styling is helpful when you need to make quick temporary tweak or when you’re testing fonts, colors and weights, however for the long run you’ll want all of your styles parked in a separate stylesheet and called into your HTML document using class selectors.

If you do have the need to style an element inline, this is how you do it:

Code:


<!DOCTYPE html>

<html>

<head

</head

<body>

<p style="color: blue">
This paragraph color will now be blue.
</p>

</body>

</html>

Output:

This paragraph color will now be blue.