Scribd
Upload
4 views2 pages

CSS Basics Guide

CSS (Cascading Style Sheets) is essential for web design and development, enhancing the appearance of web pages. It can be included in three ways: inline CSS directly in HTML elements, internal CSS within the head section of the HTML document, and external CSS through a separate stylesheet linked in the HTML. The external method is preferred for better organization and reusability of styles across multiple HTML files.

Uploaded by

abeldena123
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
4 views2 pages

CSS Basics Guide

CSS (Cascading Style Sheets) is essential for web design and development, enhancing the appearance of web pages. It can be included in three ways: inline CSS directly in HTML elements, internal CSS within the head section of the HTML document, and external CSS through a separate stylesheet linked in the HTML. The external method is preferred for better organization and reusability of styles across multiple HTML files.

Uploaded by

abeldena123
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 2

CSS

CSS (Cascading Style Sheets) is what makes web pages look good and presentable.
It’s an essential part of modern web development, and a must-have skill for any web
designer and developer. Getting Started Let’s start with learning how we can include CSS
in our projects. There are typically three ways we do that.

1. Inline CSS First off, we can include CSS directly in our HTML elements. For this, we
make use of the style attribute and then we provide properties to it.

<h1 style="color: blue"> The Learning Hub</h1>

Here we’re giving it the property of color, and setting the value to blue, which results
in the following:

We can also set multiple properties inside the style tag if we wanted. However, I don’t want
to continue down this path, as things start to get messy if our HTML is cluttered with lots of
CSS inside it.

This is why the second method to include CSS was introduced. 2. Internal CSS The other
way to include CSS is using the style element in the head section of the HTML document.
This is called internal styling

<head>
<style>
h1 {
color: green;
}
</style>
</head>

In the style element, we can give the styling to our HTML elements by selecting the
element(s) and provide styling attributes. Just like we applied the color property to the h1
element above.

2. External CSS

The third and most recommended way to include CSS is using an external stylesheet. We
create a stylesheet with a .css extension and include its link in the HTML document, like this:

<head>
<link rel="stylesheet" href="style.css">
</head>
In the code above, we have included the link of style.css file using the link element. We then
write all of our CSS in a separate stylesheet called style.css so that it’s easily manageable

//style.css
h1 {
color: blue;
}

This stylesheet can also be imported into other HTML files, so this is great for
reusability.

You might also like