bugl
bugl
HomeLearnPatternsPathsSearch
HomeLearnPatternsPathsSearch

Loading lesson path

Learn/CSS/CSS Foundations
CSS•CSS Foundations

How To Add Inline CSS

Flash cards

Review the key moves

1/4
Core idea

What is the main idea behind How To Add Inline CSS?

Lesson checks

Practice each idea before moving on

Short Mimo-style checks built from this lesson's code, terms, and sequence.

1Quick choice

Which statement best captures the main point of this lesson?

2Fill blank

Complete the missing token from the example code.

<!___ html>

Inline CSS

An inline style may be used to apply a unique style for a single element.

To use inline styles, add the style attribute to the relevant element. The style attribute can contain any CSS property.

Example

Formatted code
  <!DOCTYPE html>
<html>
<body>
<h1 style="color:blue;text-align:center;">This
  is a heading</h1>
<p style="color:red;">This is a paragraph.</p>

  </body>
</html>

Live preview

Tip

An inline style loses many of the advantages of a style sheet (by mixing content with presentation). Use this method sparingly.

Previous

How To Add Internal CSS

Next

Multiple Style Sheets & Cascading Order