External stylesheet gives an advantage over inline stylesheet (that is having the stylesheet inside the HTML: it reduces the page load time since the CSS is all inside one file. Moreover, the changes made on that one file are simultaneously reflected on all pages that link to the stylesheet.
So, how do we go about using external stylesheet?
Step 1:
First of all, you will need to have all your CSS codes saved into a file. You can name the file anything you want but be sure to save it as .css extension. Meaning, if you name your stylesheet 'style', the full filename is 'style.css'.
Step 2:
Upload this file to your server. Take note of the directory where you upload the stylesheet. Usually it is stored in the root directory.
Step 3:
Next, open up your HTML file and stick this line between your tags:
However, if you are storing the stylesheet in a specific folder (not in root directory), for example in a folder called styling, the code will look like this:
Now you may want to know what purpose does the code above serves. The code above is used to call or load up the stylesheet into your HTML.
Step 4:
Save your HTML file (and upload it to your server if you haven't) and you're done!