0% found this document useful (0 votes)
7 views

CSS BASIC NOTES

Uploaded by

Agent D
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
0% found this document useful (0 votes)
7 views

CSS BASIC NOTES

Uploaded by

Agent D
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/ 3

CSS COMPLETE BASIC NOTES:

Chapter 0: Introduction

HTML is just a skeleton of a website whereas CSS is needed to design a website.


CSS enables the user to make their website look more visually appealing by
adding different styles to the website in different forms to make it look beautiful.

What is CSS?
● CSS stands for ‘Cascading Style Sheets’
● CSS is used for styling of the backbone page or the content created using
the HTML language.
● CSS is an optional language but it helps in converting an absolute simple
webpage with no styling to a very visually appealing and responsive
website.

Your first line of CSS!


Create a .css file inside your directory and add it to your HTML. Add the following
line to your CSS:

body {
background-color : red;
}

This will make the background of the page blue


Chapter 1: Creating our first CSS Website
We will create our first CSS website in this section.

What is DOM?
DOM stands for document object model. When a page is loaded, the browser
creates a DOM of the page, which is constructed as a tree of objects.

HTML ID and class attributes:


When an HTML element is given an id, it serves as a unique identifier for that
element.

On the other hand, when an HTML element is given a class, it now belongs to that
class. One or more elements can belong to a single class but every element must
have a unique id (if assigned).

We can add multiple classes to an element like this:

<div id= “first” class=“C1 C2 C3”> [Multiple classes followed by spaces]


…….
</div>

Three ways to add CSS to HTML:


1. <style> tag → Adding <style> … <style> to HTML
2. Inline CSS → Adding CSS using style attribute
3. External CSS → Adding a stylesheet (.CSS) to HTML using <link> tag.

CSS Selectors:
A CSS Selector is used to select an HTML element(s) for studying.

body {
color : red; → Declaration (property : value)
background : pink; → Declaration
}

Element Selector:
It is used to select an element based off the tagname for example:

h2 {
color : blue;
}
id Selector:
It is used to select an element with a given id for example:

#first{

You might also like