Member-only story
Source:- How to add CSS to HTML
For more questions and answers visit our website at Frontend Interview Questions
In this article, we’ll explore the different ways to add CSS to your HTML document, making your website captivating and user-friendly.
The Three Flavors of CSS Integration:
- Inline CSS: This method involves adding CSS directly to an HTML element using the
styleattribute. While convenient for quick tweaks, it can quickly clutter your code and become difficult to maintain for larger projects.
Example:
<p style="color: red; font-size: 20px;">This text is styled inline.</p>- Internal CSS: This approach involves creating a dedicated
<style>tag within the<head>section of your HTML document. Here, you can define styles for various elements using class selectors, IDs, or element tags. This method offers better organization and maintainability compared to inline CSS.
Example:
<head>
<style>
p {
color: blue;
font-family: Arial, sans-serif;
}
h1 {
text-align: center;
font-size: 30px;
}
</style>
</head>
<body>
<p>This text is styled internally.</p>
<h1>Internal CSS rocks!</h1>
</body>- External CSS: The preferred method for…