HTML style is used to apply design and formatting to HTML elements. It helps improve the appearance of webpages by changing colors, fonts, backgrounds, text alignment, and more.
1️⃣ Inline CSS → Directly inside an element
<p style="color: red;">Red text</p>
✔ Quick but hard to maintain.
2️⃣ Internal CSS → Inside <style>
in <head>
<style>
p { color: blue; }
</style>
✔ Good for small projects.
3️⃣ External CSS → In a separate .css
file
p { color: green; }
<link rel="stylesheet" href="styles.css">
✔ Best for large projects.
Property | Description | Example |
---|---|---|
color |
Changes text color | color: blue; |
font-size |
Sets text size | font-size: 20px; |
background-color |
Changes background | background-color: yellow; |
text-align |
Aligns text | text-align: center; |
border |
Adds a border | border: 2px solid black; |
padding |
Space inside an element | padding: 10px; |
margin |
Space outside an element | margin: 20px; |
<p style="color: white; background-color: black; text-align: center;">Styled paragraph</p>
✔ Text is white, background is black, and text is centered.
✔ Use external CSS for large projects.
✔ Avoid inline styles for maintainability.
✔ Keep styles consistent for a clean design.