There are 3 ways of linking CSS and HTML
- Inline CSS
- Internal CSS
- External CSS
We are going to be focusing on External CSS, but feel free to explore the other two methods
To link an HTML file with a CSS file we have to have a specific line of code within our <head> tags in our HTML file.
<link rel=”stylesheet” type=”text/css” href=”style.css”>
The tag is a ‘link’ tag and it has 3 attributes ‘rel’, ‘type’ and ‘href’. You should be familiar with the href attribute from the Black Hat course. The href attribute specifies the URL of the file we are wanting to link. So in this case we want to link ‘style.css’ which is our CSS file. However rel and type should be new to you.
- rel is an attribute used to specify the relationship between the HTML file and the file that is being linked, so in this case our CSS file.
- type is an attribute that specifies that the file being linked is a CSS file.
Note: When creating a new project on Repl.it it automatically links the CSS and HTML pages together for you!