External CSS

Week 3 - Learning about External CSS and CSS properties

What is External CSS?

External CSS involves creating a separate CSS file and linking it to your HTML document. This approach offers several advantages:

Separation of content (HTML) and presentation (CSS)
Reusability across multiple pages
Easier maintenance
Faster page loading (browser caching)
Cleaner code organization

                <!-- How to link to external CSS -->

                <head>

                  <link rel="stylesheet" href="css/styles.css">

                </head>

Separation of Concerns

External CSS allows you to separate your content (HTML) from its presentation (CSS). This makes your code more maintainable and easier to understand.

Learn More

Reusability

By creating external CSS files, you can apply the same styles to multiple HTML pages, ensuring a consistent look across your entire website.

Learn More

Easier Maintenance

When you need to update styles, you only need to change one file rather than modifying multiple HTML documents.

Learn More

Common CSS Properties

CSS includes a wide range of properties to control the appearance of your web pages. Here are some of the most commonly used categories:

Category	Examples	Description
Text Properties	color, font-family, font-size, text-align	Control the appearance and layout of text
Box Model	margin, padding, border, width, height	Control the spacing and dimensions of elements
Background	background-color, background-image	Control the background appearance of elements
Layout	display, position, float, flex, grid	Control how elements are positioned on the page

Visit the CSS Properties page to learn more about these properties and how to use them effectively.

What is External CSS?

Separation of Concerns

Reusability

Easier Maintenance

Common CSS Properties

Contact Us