In this section, we will learn what the style attribute is and how to use it in HTML.

What is Style: HTML Inline style Attribute Definition and Usage

The style attribute is used to set a CSS style for an HTML element.

Basically, the style attribute is used to create an inline style.

You should know that using inline style will override any global style set in the <style> element or external styles brought via <link> element.

HTML style Attribute Syntax

<element style = “CSS style”>

HTML style Attribute Values

The value we set for the style attribute is any CSS property that we want to apply to the target element.

Example: styles in HTML

See the Pen styles in HTML by Omid Dehghan (@odchan1) on CodePen.

For this example, the final background color is set to red, which is the value set in the style attribute.

Example: styles in HTML tags

See the Pen styles in HTML tags by Omid Dehghan (@odchan1) on CodePen.

Example: CSS div Style

See the Pen CSS div Style by Omid Dehghan (@odchan1) on CodePen.

Multiple style HTML

Multiple styles mean we want to use more than one CSS property and apply it to an element. For this to happen, we use semicolon to separate each CSS property from the other.

Example: multiple style in HTML

See the Pen multiple style in HTML by Omid Dehghan (@odchan1) on CodePen.

Example: styling text in HTML

See the Pen styling text in HTML by Omid Dehghan (@odchan1) on CodePen.