css - External css

External CSS is a way to apply styles to an HTML document by linking to a separate CSS (Cascading Style Sheets) file. This approach helps keep your HTML clean and your styles reusable across multiple pages.

You create a .css file (e.g., styles.css) that contains all your CSS rules, and then you link it to your HTML file using the <link> tag inside the <head> section.

ex: index.html

<!DOCTYPE html>

<html>

<head>

<title>My Website</title>

</head>

<body>

<h1>Welcome to My Website</h1>

<p>This is a paragraph.</p>

</body>

</html>

styles.css

body {

background-color: blue;

font-family: Arial, sans-serif;

}

h1 {

color: navy;

text-align: center;

}

p {

color: #333;

font-size: 16px;

}