1 00:00:01,150 --> 00:00:03,310 Welcome in this video. 2 00:00:03,510 --> 00:00:13,860 I will be quick to calculator structure something in my index some of my index is team of Father which 3 00:00:13,860 --> 00:00:15,540 is highlighted here. 4 00:00:15,540 --> 00:00:27,780 So start by creating a doc type first so you do a left angle bracket exclamation mark and type pain 5 00:00:28,020 --> 00:00:39,230 doc time and space hastier email dog type is not actually part of this email he said declaration to 6 00:00:39,260 --> 00:00:44,880 the Web browser to notify the web browser that the content of this file. 7 00:00:45,060 --> 00:00:56,130 He sent hastier mail far so on the next line up and create the beginning of the hastier mail. 8 00:00:56,520 --> 00:01:03,330 The beauty of brackets is that he automatically closes the tag for you which is very useful. 9 00:01:03,330 --> 00:01:13,410 So I need to do just press tab or enter to separate the hastier mail so any content between the opening 10 00:01:13,410 --> 00:01:19,680 and closing to mail is regarded as to how to hastier email far. 11 00:01:20,100 --> 00:01:30,020 So let me create the header section for these documents are typing head with content in the head section 12 00:01:30,030 --> 00:01:32,170 does not get displayed. 13 00:01:32,370 --> 00:01:41,220 Its just for informational reference purposes so I'm just going to tab to separate the content inside 14 00:01:41,220 --> 00:01:51,020 the head content here I am going to create a title that will appear on the bar of a web browser and 15 00:01:51,180 --> 00:01:56,690 to do that you use the title element in it. 16 00:01:59,170 --> 00:02:02,500 That's Main and that's closing. 17 00:02:02,520 --> 00:02:11,690 In between that are specified the title are just say simple cow coolly. 18 00:02:12,750 --> 00:02:14,380 All right so that's my title. 19 00:02:14,380 --> 00:02:22,020 Next thing I want to do in the home section is reference my sisters file which is this file in the external 20 00:02:22,020 --> 00:02:28,440 file so to do that I need to link it to the link. 21 00:02:28,950 --> 00:02:38,130 Real means this is an attribute that repaid the value of the country build its stylesheet. 22 00:02:39,570 --> 00:02:48,330 Okay I'm going to add another attribute and the value of this attribute is going to be text. 23 00:02:48,350 --> 00:02:50,560 Is this in the type of file. 24 00:02:50,580 --> 00:02:53,360 This yes this is a text. 25 00:02:53,400 --> 00:02:54,240 C c. 26 00:02:54,250 --> 00:03:02,850 So as far as what this attribute is saying makes in I need to reference where it's located because it's 27 00:03:02,850 --> 00:03:07,960 located in the same their okorie as the index still has terminal far. 28 00:03:08,070 --> 00:03:16,740 All I need to do is specify the name of the file which estar dot C S s he can see. 29 00:03:16,740 --> 00:03:20,840 That's the name of call it refers to there. 30 00:03:21,180 --> 00:03:34,230 I have to close the track so that's all I need to do in the head section of my document so I will just 31 00:03:34,230 --> 00:03:35,240 say that. 32 00:03:37,280 --> 00:03:43,190 And that's my head fiction done soul less dead body element. 33 00:03:43,190 --> 00:03:49,790 So the body or an element is what more contain the actual visible content. 34 00:03:49,790 --> 00:04:01,580 So to say less than sign and time embodying are clues that tab to separate the tank. 35 00:04:01,600 --> 00:04:10,300 All right so in between the body element is where I will place the visible content. 36 00:04:10,340 --> 00:04:17,730 The first thing I want to do I want to add a head in for the calculator is going to be hit one heading. 37 00:04:17,800 --> 00:04:23,950 So Type 1 and type in the name of the head. 38 00:04:24,230 --> 00:04:31,920 This would be called simple calculator. 39 00:04:32,690 --> 00:04:41,430 So that's the hedin I want to close the kirkley tool inside a form. 40 00:04:41,530 --> 00:04:53,600 So I am going to create a form so to do that again use the tags and type in form inside the opening 41 00:04:53,600 --> 00:04:54,130 form. 42 00:04:54,130 --> 00:04:57,470 I'm going to add a couple of attributes. 43 00:04:57,500 --> 00:05:01,380 The first is going to be an idea to identify the form. 44 00:05:01,730 --> 00:05:08,800 So if I want to style it using assets I will stylee by using this side. 45 00:05:09,230 --> 00:05:19,100 So the idea that it's going to be forced to call this car form which indicates calculator for a minute 46 00:05:19,350 --> 00:05:24,940 and another attribute this is going to be a name attribute. 47 00:05:24,990 --> 00:05:30,440 And I'm going to give this a name or car. 48 00:05:30,820 --> 00:05:32,930 So this is the name. 49 00:05:33,140 --> 00:05:34,430 This is the. 50 00:05:35,780 --> 00:05:40,480 Now can close the form. 51 00:05:40,520 --> 00:05:42,630 So I'm just going to separate that. 52 00:05:43,010 --> 00:05:52,480 So we have the opening and closing and in between inside the form element is where I will add the various 53 00:05:52,490 --> 00:05:54,430 buttons for the cup. 54 00:05:54,710 --> 00:06:02,150 I'm going to wrap up this video here before I go I just want to quickly. 55 00:06:02,360 --> 00:06:07,010 What has been done so far by clicking on this sign here. 56 00:06:07,010 --> 00:06:15,400 This is a live preview that will preview the content of what we have done so far. 57 00:06:15,440 --> 00:06:22,790 So you can see here the only visible content we have here is the one heading element which is this one 58 00:06:22,790 --> 00:06:23,320 here. 59 00:06:23,650 --> 00:06:32,150 The farm obviously will not show yet because I have not had any content to form element so in the next 60 00:06:32,150 --> 00:06:37,150 video we'll start adding some buttons for the cut. 61 00:06:37,580 --> 00:06:39,150 So thanks for watching. 62 00:06:39,150 --> 00:06:40,230 Bye for now.