1
00:00:00,510 --> 00:00:10,080
Divs are yet another very important part of CSF development and are represented by the div tags in order

2
00:00:10,080 --> 00:00:18,210
to understand the function of a div let's refer back to the web page we developed using tables when

3
00:00:18,210 --> 00:00:19,800
we created the Web page.

4
00:00:19,800 --> 00:00:30,020
All the content including text and images were nested in tables cells as we determined we did not have

5
00:00:30,020 --> 00:00:37,680
much flexibility in the positioning of these objects within the cell or the table itself for that matter

6
00:00:40,380 --> 00:00:49,460
divs are similar to table cells in that they contain content such as text images or media objects.

7
00:00:49,480 --> 00:00:57,830
The key difference is that divs offer a much higher degree of customization in formatting and position

8
00:00:57,830 --> 00:01:08,620
in this includes things like rounded corners transparency layering and complete flexibility in positioning

9
00:01:08,980 --> 00:01:10,000
down to the pixel

10
00:01:13,220 --> 00:01:15,370
before we begin this tutorial.

11
00:01:15,380 --> 00:01:24,370
Please open your text editor and set up your basic HDL page structure as shown save the file is div

12
00:01:24,460 --> 00:01:29,500
dot H2 UML on your computer.

13
00:01:29,540 --> 00:01:35,480
Now let's go ahead and create a div in our document and fill it in with some basic text content

14
00:01:38,910 --> 00:01:42,720
we will create the div in between our open and close body tags

15
00:01:54,760 --> 00:02:04,060
the open div tag requires a closing div tag the content in between the opening and closing do tag will

16
00:02:04,060 --> 00:02:11,280
be displayed in your browsers content area.

17
00:02:11,340 --> 00:02:13,180
Now let's go ahead and save this file.

18
00:02:14,700 --> 00:02:16,290
And preview this in our web browser

19
00:02:22,500 --> 00:02:29,350
so here we can see the line of text we input it into the div.

20
00:02:29,550 --> 00:02:36,450
You can think of it is a line of text contained within a single table cell if this were a table the

21
00:02:36,450 --> 00:02:41,120
table would have one column and one row equating to one cell.

22
00:02:44,510 --> 00:02:50,420
We haven't done any CSX formatting to this div and we'll be exploring that in the next lecture.