1
00:00:05,520 --> 00:00:08,380
It's on the last video we got our feet wet and started typing.

2
00:00:08,400 --> 00:00:11,670
And Jay Querrey in here hopefully that made perfect sense.

3
00:00:11,670 --> 00:00:12,290
Clear as mud.

4
00:00:12,300 --> 00:00:12,860
Right.

5
00:00:13,110 --> 00:00:18,000
So what we're going do now is try to make it make a little bit more sense and show as a little bit more

6
00:00:18,000 --> 00:00:21,090
practical of a exercise here.

7
00:00:21,150 --> 00:00:25,480
What I can do is begin work on selectors and kind of filters to here.

8
00:00:25,560 --> 00:00:28,910
So just save this as a new documents so we can come back to it if we want to.

9
00:00:28,960 --> 00:00:37,320
So you say there's a selector it's name it that right now again to kind of keep the separate here.

10
00:00:37,320 --> 00:00:42,600
And the last time we said the document itself loan's do something here.

11
00:00:42,630 --> 00:00:46,050
So instead of doing this.

12
00:00:46,140 --> 00:00:48,040
So I'm just loaning this information right here.

13
00:00:48,040 --> 00:00:49,730
Can we cut that out of there.

14
00:00:49,770 --> 00:00:56,070
I'm going to put that in the body of my document so maybe I already have this H-1 title in here and

15
00:00:56,070 --> 00:00:58,680
maybe I just wanted to do some cool styling with it.

16
00:00:58,800 --> 00:01:01,740
Unique within a query itself.

17
00:01:01,740 --> 00:01:06,690
Now again we talked about the different things that great can do and one of the things is altering both

18
00:01:06,690 --> 00:01:09,350
each team male and CSSA and things like that.

19
00:01:09,600 --> 00:01:12,780
So let's see how we can use Jake to edit that success.

20
00:01:14,650 --> 00:01:19,580
And you still start out with the slide of the dollar sign right here in the opening close pair of parentheses

21
00:01:19,600 --> 00:01:20,730
and quotes.

22
00:01:21,130 --> 00:01:26,740
But instead of saying the entire body don't append something to the body I want to just alter just the

23
00:01:26,800 --> 00:01:28,730
each one tag there.

24
00:01:28,750 --> 00:01:33,580
So again this can be any kind of CSSA or each T.M. element right here.

25
00:01:33,580 --> 00:01:39,270
And instead of a Pentium one is going to go ahead and get rid of that whole thing right there.

26
00:01:39,280 --> 00:01:46,420
What I'm I say is target the H-1 Taggert here and I want to use C-s us.

27
00:01:46,440 --> 00:01:47,660
All right.

28
00:01:47,680 --> 00:01:53,310
So again H-1 see a sense and what we can do now is basically just have like we would with irregular

29
00:01:53,320 --> 00:01:54,840
CSSA within here.

30
00:01:55,030 --> 00:01:58,890
Now maybe what I want to do is add a border to it.

31
00:01:58,930 --> 00:02:02,960
So open a pair of quotes right here and I'll say Gorder.

32
00:02:03,180 --> 00:02:10,470
And now we separate the separate the property with a value here by adding that little Kamerick there.

33
00:02:10,610 --> 00:02:18,080
So the property is border and the value is going to be a one pixel Solomon

34
00:02:20,520 --> 00:02:28,240
on say and green border right there.

35
00:02:28,430 --> 00:02:33,740
So we should be saying some of the document loads here once it's ready take anything with an each one

36
00:02:33,740 --> 00:02:35,970
tag applies and see access to it.

37
00:02:35,990 --> 00:02:39,520
And in that case border one pixel dotted green.

38
00:02:39,530 --> 00:02:45,230
Now if here to write this as just c s s it would look very much like this it would be each one and then

39
00:02:45,230 --> 00:02:46,860
open or close the curly brackets.

40
00:02:46,970 --> 00:02:51,220
And then it would say border hole in one pixel dotted grains would be just like that.

41
00:02:51,380 --> 00:02:56,080
But we're adding it within the decreased syntax right here.

42
00:02:56,330 --> 00:03:01,330
So save this document and remember to grab the selectors.

43
00:03:01,700 --> 00:03:05,490
Each time a file that we just created and try to get onto a browser.

44
00:03:05,600 --> 00:03:12,450
You can see the clothes that are out there and see that it did and a dotted green border all around

45
00:03:12,450 --> 00:03:12,730
me.

46
00:03:12,740 --> 00:03:19,640
Each one tag up here so I could just as easily come back and say Make it a three pixel

47
00:03:22,370 --> 00:03:26,220
solid border and say that's come back to my browser.

48
00:03:26,690 --> 00:03:30,920
And it is added up there.

49
00:03:30,980 --> 00:03:31,910
Pretty cool huh.

50
00:03:32,180 --> 00:03:36,800
So now I did say VRAM doing both selectors and filters.

51
00:03:36,810 --> 00:03:39,010
And here's what I mean by filter.

52
00:03:39,200 --> 00:03:45,650
So let's say we've got I don't know maybe we got a couple H1 tags in here and latches on a screen.

53
00:03:45,700 --> 00:03:51,290
And one two or three after that just so I can see that the difference is here.

54
00:03:51,300 --> 00:03:54,180
So I mean we've got three H-1 tags in here.

55
00:03:54,210 --> 00:03:58,330
We don't want them all to have this basic layout here.

56
00:03:58,430 --> 00:04:06,230
So what we can do is add a filter right in here to the H-1 and I can say Kallen first.

57
00:04:06,400 --> 00:04:07,890
That's what that's going to do.

58
00:04:07,970 --> 00:04:14,870
And just change it up a little bit here's a two pixel register I can see that's changed and I'm targeting

59
00:04:14,870 --> 00:04:18,280
just the first H-1 tag with Edinger.

60
00:04:18,320 --> 00:04:25,490
So if I save that and come to my browser I can hit refresh and see I've added 1 2 and 3 and that is

61
00:04:25,490 --> 00:04:29,770
going to affect just the first one not all three of them.

62
00:04:29,840 --> 00:04:35,750
I can also just as easily say last come back and refresh my document.

63
00:04:35,870 --> 00:04:40,000
And now it's targeting just the last H-1 tag within here.

64
00:04:40,040 --> 00:04:45,290
So a lot of cool things you can do your hopes are just starting to get the idea of what you can do with

65
00:04:45,290 --> 00:04:45,700
here.

66
00:04:45,830 --> 00:04:49,660
You've only scratched the surface because there are so many more cool things that are and redoing and

67
00:04:49,670 --> 00:04:51,020
future videos.