All right guys we are leveling up. In this module, 1
we’re going to talk about Cascading Style Sheets. 2
First let's understand why CSS was created and why it's necessary. 3
Now if you think back to the 90s web developers wanted to style up their web sites making it look the 4
way that they wanted to and it wasn't always pretty but the toolset that they had in order to do this 5
were very very limited. 6
And this is what it might look like if you only had HTML to style your web sites, and, as an aside, 7
this is a real web site and you could still visit it at this URL. 8
Now in order to style up the web site using pure HTML, which is all they really had access to, they had 9
to use HTML tags. 10
For example the font tag which you can use to change the font of the text being displayed and you can 11
also use things like the center tag which simply centers any element on screen. 12
Now in addition to that people also used attributes. 13
For example you can set the h1s background color using the background color attribute to a particular 14
color hex code and that would change the h1 to a different color. 15
Now the problem really comes along when you start messing around with the layout using just HTML because 16
as we've seen in order to change our layout for our personal web site so that we can have text and images 17
that exist side by side we have to use tables. 18
And the problem with tables is that they are really really wordy. 19
You have to write a lot of code in order to do something very simple which is displaying that image 20
next to your h1 and your paragraphs, having it on the same horizontal level. 21
And look at how much code we had to write just to do that simple thing. 22
Now the other problem with tables is that its very very easy to make syntax errors and it's very easy 23
to mess up if you say forgot a td here you would end up with errors all over the place and it's very 24
difficult to debug as well. 25
And also if you started getting into more complex table layouts you had to embed tables within tables 26
in order to get more columns and more rows and more flexible layout and the whole thing just became this 27
horrible horrible mess. 28
So that's why people started using something called Cascading Style Sheets. 29
And this is what's called a style sheet or a style language in the sense that it can't really do anything 30
by itself. 31
It's only purpose in life is to style markup language. 32
So for example each HTML, XML code, and in this module we're going to explore all the powerful things 33
that you can do with Cascading Style Sheets to bring your web site from the 90s into the current day 34
and age. 35
So enough talking let's get started styling up our web site using CSS.