• The style attribute in HTML is used to define the inline style within the HTMl tags.
• Any style defined globally, such as styles specified in the <style> tag or in an external style sheet, will be overridden by the style attribute.
• It belongs to the Global Attributes group and can be applied to any HTML element.

Syntax

We can write the 'style' attribute followed by style definitions' like the color , font-size, text-alignment etc. inside the tags of any HTML element as folllows:

Syntax

Use Of The Style Attribute

Let us look at some examples for how to use HTML attribute to define inline styles.

Example

Output

This is a styled header

I am happy to read this line styled in red color

As we can see the examples given above do the following things:

• change header color, font-size and position of HTML header
• change the color of a paragraph in HTML

Why You Shouldn’t Use Inline Styles

Here are some reasons why you should avoid using inline styles unless absolutely necessary:

• They give the HTML source code more weight.
• They're difficult to keep track of and manage. They make it difficult to read and debug HTML source code.
• These inline styles can't be used anywhere else or in other words, they can't be reused for some other HTML element as we do in external style sheet styling.
• Inline styles cannot be cached by browsers. As a result, the website takes longer to load and reply.

Browser Support