There are 3 ways to insert CSS style sheet in our HTML document.
1. - External style sheet
2. - Internal style sheet
3. - Style defined in the same element
It is the most common way to define a style sheet.
Ideal when our CSS stylesheet will be used in multiple web pages HTML, because when we want to change the style of those HTML pages, just change the external file with the CSS style sheet, and automatically all our HTML web pages will be updated with the new definition, without touching them.
To define an external style sheet, create a new file with "css" where we define all necessary styles.
For example, the file "style.css" shall have the following styles:
In HTML web pages which use this style sheet, the sheet will include using the element <link>
For example, my website "page1.html" can be:
When each website has its own style HTML different then these styles are defined internally in each HTML page using the tag <style>
For example, our website "webpage.html" can be:
You can define the CSS style in the same HTML element.
This is not recommended, because it breaks with the advantages of style sheets, separating content (HTML) from presentation (CSS).
Our html "webpage.htm" would look like: