How to use CSS inline and internal style sheet

CSS has 3 types of style sheets

  • Inline Stylesheet
  • Internal Stylesheet
  • External Stylesheet

INLINE STYLESHEET

Inline CSS has the highest priority out of external, internal, and inline CSS. This means that you can override styles that are defined in external or internal by using inline CSS. If you want to add a style inside an HTML element all you have to do is specify the desired CSS properties with the style HTML attribute.

EXAMPLE:

<p style="background: red; color: white;">LEARN WEB DEVELOPMENT</p>

INTERNAL STYLE SHEET

An internal style sheet is the usage of stylesheet within the HTML document. When using internal CSS, you must add a new tag, <style>, inside the <head> tag.

EXAMPLE:


<html>

<head>
<style>

p {color: red; }
body {background-color: white; }

</style>
</head>

<body>
<p>LEARN WEB DEVELOPMENT</p>

</body>

</html>

NOTE:

  • Place your CSS Code between <style> and </style>
  • Be sure you know the correct format(syntax) of CSS code
  • CSS will literally save you hours of time… after you spend a few getting the hang of it
Posted in CSS Tagged with: ,