Summary
Highlights
The video introduces external style sheets, which are .css files used to write and organize all CSS for web pages. These files can then be imported into HTML files, allowing multiple HTML files to share the same CSS.
Before external style sheets, two methods were used: inline styling (adding 'style' attributes directly to HTML tags) and internal styling (placing CSS within <style> tags in the HTML header). External style sheets offer a more organized approach.
The tutorial demonstrates creating a new file named 'style.css'. The file can be named anything, but it must have the '.css' extension. CSS rules are written directly within this file, similar to how they would be in internal style tags.
To link the external CSS file to an HTML page, a '<link>' tag is used in the '<head>' section of the HTML document. The 'rel' attribute is set to 'stylesheet', and the 'href' attribute points to the location of the CSS file. This effectively imports all CSS from the external file.
A key benefit is the ability to apply the same styling across multiple HTML pages by linking the same external CSS file to each. Any changes made in the single CSS file are reflected across all linked HTML pages, ensuring consistency and ease of maintenance for website styling.