CSS (Cascading Style Sheets) is used to style HTML elements. There are three main ways to apply CSS: inline, internal, and external.
What is Inline CSS
Inline CSS is applied directly inside an HTML element using the style attribute.
Example of Inline CSS
<p style=”color: red;”>This is red text</p>
When to Use Inline CSS
Use it for quick testing or small changes. It is not recommended for large projects.
What is Internal CSS
Internal CSS is written inside the <style> tag within the <head> section of an HTML file.
Example of Internal CSS
<head> <style> p { color: blue; } </style> </head>
When to Use Internal CSS
Use it when styling a single page. It keeps styles inside one file.
What is External CSS
External CSS is written in a separate .css file and linked to the HTML file.
Example of External CSS
<link rel=”stylesheet” href=”style.css”>
And inside style.css file:
p {
color: green;
}
When to Use External CSS
It is best for large projects or multiple pages. It keeps code clean and reusable.
Difference Between Them
Inline CSS is used inside elements.
Internal CSS is used within a single HTML page.
External CSS is used in separate files for multiple pages.
Summary
Inline, internal, and external CSS are three ways to style HTML. External CSS is the most recommended method for clean, reusable, and scalable web development.