CSS in HTML
CSS (Cascading Style Sheets) is what gives life to HTML. While HTML provides the structure, CSS provides the visual layout, colors, and typography. There are three primary ways to include CSS in your HTML documents.
1. Inline CSS
Inline styles are defined within the HTML style attribute of a specific element.<h1 style="color: blue;">Hello</h1>
Pros: Quick fixes, high specificity.
Cons: Hard to maintain, repetitive, no separation of concerns.
2. Internal CSS
Internal styles are defined within a <style> element, typically inside the <head> section.
Pros: Affects the whole page, no external request needed.
Cons: Styles are limited to one page only.
3. External CSS
External styles are defined in a separate .css file and linked using the <link> tag.<link rel="stylesheet" href="styles.css">
Pros: Best for maintenance, allows caching, separates structure from design completely.
Best Practices
Always prefer External CSS for production websites. Use Internal CSS for single-page demos or emails, and avoid Inline CSS unless absolutely necessary (e.g., dynamic styles via JavaScript).