We can apply CSS in a single element by inline CSS technique.

The inline CSS is also a method to insert style sheets in HTML document. This method mitigates some advantages of style sheets so it is advised to use this method sparingly.

If you want to use inline CSS, you should use the style attribute to the relevant tag.

Syntax:

<htmltag style=“cssproperty1:value; cssproperty2:value;”> </htmltag>

Example:

 <h2 style=“color:red;margin-left:40px;”>Inline CSS is applied on this heading.</h2>
<p>This paragraph is not affected.</p>

Output:

Inline CSS is applied on this heading.

This paragraph is not affected.

Disadvantages of Inline CSS

  • You cannot use quotations within inline CSS. If you use quotations the browser will interpret this as an end of your style value.
  • These styles cannot be reused anywhere else.
  • These styles are tough to be edited because they are not stored at a single place.
  • It is not possible to style pseudo-codes and pseudo-classes with inline CSS.
  • Inline CSS does not provide browser cache advantages.