The ways to add CSS files generally there are 3 ways but we have to seen the 4 ways to add CSS files —–
- Internal CSS
- Inline CSS
- External CSS
- Using @import
Internal CSS: You can embed CSS styles within the <style> tags in the <head> section of your HTML document. This method allows you to define styles that apply to multiple elements on the same page. For example:
<head>
<style> p { color: blue; } </style>
</head>
<body>
<p>This is a paragraph with blue text.</p>
</body>
Inline CSS: You can use the style attribute within HTML tags to add inline CSS styles directly to individual elements. For example:
<p style=”color: blue;”>This is a paragraph with blue text.</p>
External CSS: You can create a separate CSS file with a .css extension and link it to your HTML document using the <link> tag. This method is useful when you want to apply the same styles to multiple HTML pages. Here’s an example:
<head>
<link rel=”stylesheet” href=”styles.css”>
</head>
<body>
<p>This is a paragraph with styles applied from the external CSS file.</p>
</body>
Using @import: method must be included either within <style> tag or else inside the style sheet.
<style>
@import url(style.css);
</style>
In the example above, the styles.css file should be located in the same directory as your HTML file
By using any of these methods, you can apply CSS styles to your HTML elements and customize the appearance of your web page.
