How To Link CSS File To HTML
There are three ways
- Inline CSS
- Internal CSS
- External CSS
1. Inline CSS
Inline CSS contains the CSS property in the body section attached with element is known as inline CSS.
<p style=”color:red;”>This is paragraph.</p>
Here
- CSS added within the HTML tag (p), color of text will be red. used to apply a unique style for a single element.
2. Internal CSS
- Internal CSS used if one single HTML page has a unique style.
<!–Within a head section –>
<head>
<style>
body {
background-color:linen;
}
h1 {
color:maroon
margin-left:40px;
}
<style>
</head>
Here
- In this example body & h1 styled using a internal CS
- Within a head section
- With <style> tag
3. External CSS
The external CSS defined outside HTML page with separate file of .css extantion.
- File .css link to html page’s with reference <link> tag in the head section, html
<head> <link rel=”stylesheet” href=”style.css”></head>
style.css linked with link tag
Separate .CSS file linked to external.html
body {
background-color:linen;
}
h1 {
color:maroon;
margin-left:40px;
}
