How to add CSS
There are three ways to add CSS to an HTML document:
1. Inline CSS: Inline CSS is applied directly to an HTML element using the style attribute. For example:
<h1 style="color: blue;">Hello World!</h1>In above example, the color property is set to “blue” using inline CSS.
2. Internal CSS: Internal CSS is defined within the head section of an HTML document using the <style> tag. For example:
<!DOCTYPE html>
<html>
<head>
<title>My Web Page</title>
<style>
h1 {
color: blue;
}
</style>
</head>
<body>
<h1>Hello World!</h1>
</body>
</html>In above example, the color property is set to “blue” for all <h1> elements using internal CSS.
3. External CSS: External CSS is defined in a separate CSS file and linked to the HTML document using the <link> tag in the head section. For example:
<!DOCTYPE html>
<html>
<head>
<title>My Web Page</title>
<link rel="stylesheet" type="text/css" href="styles.css">
</head>
<body>
<h1>Hello World!</h1>
</body>
</html>In above example, an external CSS file called “styles.css” is linked to the HTML document, which contains the CSS styles to be applied to the HTML elements.
In summary, CSS can be added to an HTML document using inline CSS, internal CSS, or external CSS. Inline CSS is applied directly to an HTML element, internal CSS is defined within the head section of an HTML document, and external CSS is defined in a separate CSS file and linked to the HTML document using the <link> tag.