1
00:00:05,300 --> 00:00:11,090
Welcome back in this lecture we're going to take a quick moment to discuss each time I'll divs and spans

2
00:00:11,530 --> 00:00:18,950
divs stands for divisions later on when we're talking about C Ss and bootstrap for in order to add styling

3
00:00:18,950 --> 00:00:19,840
to our sites.

4
00:00:20,030 --> 00:00:25,580
We're sometimes going to only want to apply the style to a certain section or division of the website

5
00:00:26,450 --> 00:00:30,720
divs and spans tags allow us to segment portions of our age T.M..

6
00:00:30,800 --> 00:00:34,960
That way we can later on apply styles only to those specific portions.

7
00:00:34,970 --> 00:00:40,220
So right now you're not really going to see an effect when we only perform of h t m l but later when

8
00:00:40,220 --> 00:00:46,220
we actually add in a CSSA class call or another style call from Bootstrap then you'll be able to understand

9
00:00:46,430 --> 00:00:48,540
why we would need div and span's.

10
00:00:48,560 --> 00:00:53,230
So this is just a very quick moment to introduce the actual syntax that spans.

11
00:00:53,390 --> 00:00:55,730
Later on we'll actually see their use case.

12
00:00:55,970 --> 00:00:58,310
Let's get started by hopping over to the text editor.

13
00:00:58,310 --> 00:00:58,670
All right.

14
00:00:58,670 --> 00:00:59,400
I'm back here.

15
00:00:59,420 --> 00:01:04,940
My basic thought each team M-file and what it will do is show you how you can build a div and also insert

16
00:01:04,970 --> 00:01:06,340
a span tag.

17
00:01:06,340 --> 00:01:12,590
So for a div or division what we do is we type out div and if hit enter it will automatically create

18
00:01:12,590 --> 00:01:17,210
the closing tag and notice it also automatically creates this class call.

19
00:01:17,210 --> 00:01:22,130
Now we don't actually know about classes yet because we haven't discussed CSSA but later on we'll we're

20
00:01:22,130 --> 00:01:28,460
going to do is we're going to import a special string here that connects to the SS call and that will

21
00:01:28,460 --> 00:01:32,020
add styling to everything in between these two div tags.

22
00:01:32,020 --> 00:01:38,900
So in between these two div tags you can add in whatever you want such as a header heading and then

23
00:01:38,900 --> 00:01:42,000
maybe even a paragraph some stuff.

24
00:01:42,450 --> 00:01:47,640
And if you save this and refresh your page you'll just see heading in some stuff.

25
00:01:47,640 --> 00:01:51,790
In fact it will look the same as if you didn't even have a div there.

26
00:01:51,810 --> 00:01:55,180
So if I delete those and refresh I won't see any changes.

27
00:01:55,320 --> 00:02:01,500
But keep in mind once we actually add in this class string and connect it to a CSSA file then we will

28
00:02:01,500 --> 00:02:05,490
see changes only performed on things within this division.

29
00:02:05,520 --> 00:02:11,490
So that's a nice way of basically dividing up everything inside your body for your T.M. because later

30
00:02:11,490 --> 00:02:13,670
on we'll see a very large H.T. mail files.

31
00:02:13,710 --> 00:02:18,500
It'll be nice to organize them as well as apply styles by divisions.

32
00:02:18,510 --> 00:02:24,330
The last thing I want to know is sometimes you want to apply styling to only a certain thing inside

33
00:02:24,420 --> 00:02:26,120
of an already existing tag.

34
00:02:26,400 --> 00:02:31,050
For example I can have a paragraph tag and let's say there's some stuff in it.

35
00:02:31,050 --> 00:02:37,210
So here is some text woohoo.

36
00:02:37,290 --> 00:02:41,650
Let's imagine that I wanted to apply a style call to only some text.

37
00:02:41,730 --> 00:02:47,520
What I could do is instead of having to deal of this div tag which is meant for larger divisions I'm

38
00:02:47,520 --> 00:02:55,810
already within a paragraph tag what I'm going to do is type outspan and hit enter and this span.

39
00:02:55,830 --> 00:02:59,540
Basically what you put is the text you want to manipulate.

40
00:03:00,000 --> 00:03:06,990
So I have some text within the span and then later on we can do is add a class call to span.

41
00:03:06,990 --> 00:03:13,410
So in the future we'll see something like this with some sort of string in here with my class.

42
00:03:13,580 --> 00:03:19,200
Right now since we haven't discussed CSSA yet I just want you to be aware of that when you want to add

43
00:03:19,260 --> 00:03:21,510
a style to something else or do it then tags.

44
00:03:21,660 --> 00:03:23,170
You'll be using span.

45
00:03:23,250 --> 00:03:28,950
Now again if I save this and refresh I won't see any real differences between having spent in there

46
00:03:29,370 --> 00:03:31,920
or taking those spand tags out.

47
00:03:31,920 --> 00:03:35,160
So if I save that and refresh you won't notice any difference.

48
00:03:35,360 --> 00:03:38,600
Again will only be using this once we actually learn about C Ss.

49
00:03:38,680 --> 00:03:42,100
OK so that was just a brief moment to talk about these tags.

50
00:03:42,240 --> 00:03:46,650
That way when you see him in the CSSA lectures they're not totally unfamiliar to you.

51
00:03:46,650 --> 00:03:48,480
Thanks and we'll see you at the next one.
