Hello and welcome.
In this video I will be including new to some basic CNS Selig talks.
There are different types of celek talks in CFS.
We've already used the element selektah and also the campaign selector bar just runs through these busy
selector's on the screen.
So we've got the element selector.
Basically it refers to the outroar his team element for example the paragraph element which is the element
that is known as an element to select the heading or one that could be another element selector.
So there are different elements selectors.
You specify an elemental leg Tau base on the hastier male element you're trying to apply the thesis
to next.
We've got the idea select the it is selected basically he is used to select an element on the piece
that has a specific idea.
The These are unique.
You can only have one element part on the page.
You can't use the same idea for more to pull elements on the page.
So these select tools are unique and they are represented in the Seer says by the hash symbol.
So in a way you see how symbol in his thesis sheet you know that's referring to an IED top necks were
class select which is similar to the idea.
But the key difference with the club selector is that you can reference it multiple times.
You can declare the class selector on a page and use it on several elements on that page in comparison
to idees select or that is unique pair element on a page and you characterize that class selector with
a period of a dot.
So in a way you see a period of a dot in this SS style sheet you know you are referring to a class for
the group in Selecter.
We've used the group in select us so far in this course where we selected multiple elements and group
them together to apply styling.
Just like I've done here.
So that is known as a grouping selector.
There's also another selector here which is represented by the Asterix symbol.
What that does is used to select all the elements you want to apply set installed to all the elements
on the page.
Then you can use the esoterics solectron and that will apply the stylin to all the elements in the piece.
So this is my hastier mail.
I click on my thesis far here.
We can see an example of the krupin selector here.
This is a group in Selecter way you use group in more than one element and apply in this stylin to that
to those elements here.
This is an element select all of us use one element.
So I'm going to do I'm going to define an idea selector and also a class select so I can show you how
they are used.
So I'm going to go back to my hasty email documents click on the index storage Tim hell and I'm going
to the way you had.
You have to had an idea.
You do that using the attribute the ADA is an attribute.
So what you do here for example I want to make this paragraph 1 make the content in italics.
So what I do which is this content here is the paragraph tag is where I need to specify a space and
type in idea which is the idea attributes you give it an in name of value you surround the value in
quotes.
So I'm going to call this quote.
All right.
So I give in this paragraph an idea now which is unique.
I can not now that I use this here.
Ah can't you use the same I.D. anywhere else in the page.
This is unique to the AP.
So now I go into my sixth sense and way to use the.
You indicate a pound sign which indicates that you are referencing an I.D. form or by the name of the
idea.
I called mine quote let me go back just to make sure you don't get it right.
It will not apply this year Seth.
So that's smart.
The court quote.
And next I do the curly braces opening and closing higher.
All I want to do here is make the font the style of the font.
I want to make it italics.
And just end that with a semi.
You can see it is already reflected.
Look at this here.
You see that already in italics.
So I just click say well to this as an example of use in páidí attribute where you use the attribute
inside the mean element.
Like I've done here so you can only have one idea.
Pipi so I cannot use this idea quote any more on this page on any other element.
Next I want to add a star class a class attribute lady.
So I want to this paragraph you quote Today's a new day which is this one here.
And also this here which is this here.
I want to use class selector's to apply C says to all our do.
Inside here.
The class electo you can use it multiple times in a page while I slept.
You can only use it once.
So here I am going to define the class.
You define it inside the opening elements.
So when a typing class as attribute.
And then give it value when called it is call it para k. and I can use it again here.
And when I use it again here typing class I give it a value of power so you can see here I am using
the same class twice so you can use it any number of times.
Any element on your page.
Whereas the idea is unique.
So I can use this called quote anymore on this p.
So now I have defined this here the class inside the H2 element I need to go to my csx and add the styling
for that is called Para.
So I come here to my CFS and appear at a dot followed by the name of the class and then my curly braces.
Now separately calibrate is in between equilibrates.
I will now indicate the style rules I want.
So watch out for this paragraph here and this one here.
As I begin to type in this time it should change.
I'll see font size on to change the font size and make that 25 pixel.
If you notice is changing now makes I want to change the colour make this blue.
I forgot to separate you.
You say that.
So now I have used the class.
You can see as reflected in this two paragraph.
So that's physically how you use a class select.
And I select to so always note that the key difference between a class selector and an idea select is
that class select can be used multiple times or in any element on the page.
An I.D. soluto is unique to the element here of course it's equal.
Quote I can use this quote anywhere else on the page or any other element.
Whereas this class I've got power I can use it any way I want.
So that's it for this basic introduction to see SS select books.
Thank you for watching.
Bye for now.