An inline CSS is used to apply a unique style for a single element. This kind of style is specified within an HTML tag using the style attribute.
To use inline styles, add the style attribute to the relevant element.
The style attribute can contain any CSS property.
With inline styles, you’ll add the style attribute to an HTML tag followed by your CSS to style an element.
<p style="color: red; font-size: 20px;">This is my first paragraph.</p>
<p>This is my second paragraph.</p>With inline styles, you apply CSS to the style attribute in the opening HTML tag.
Add property-value pairs to the style attribute. You can have as many property value pairs as you want.
Add a semicolon after each property-value pair.
Unlike normal CSS syntax, inline styling does not use selectors or curly braces.
Inline styles directly affect the tag they are written in, without the use of selectors.
Disadvantages of Inline CSS
- Inline CSS does not provide browser cache advantages.
- It is not possible to style pseudo-codes and pseudo-classes with inline CSS.
- Inline CSS styles cannot be reused anywhere else.
- Inline CSS styles are tough to be edited because they are not stored at a single place.
- You cannot use quotations within inline CSS. If you use quotations the browser will interpret this as an end of your style value.