1 00:00:00,440 --> 00:00:01,070 ‫Hey, there. 2 00:00:01,190 --> 00:00:01,970 ‫Welcome back. 3 00:00:02,330 --> 00:00:08,040 ‫Now in this lecture, let us discuss about classes and ideas in simple words. 4 00:00:08,060 --> 00:00:15,320 ‫They both are used to give a name to any division or any type of order, bag, block whatever you want 5 00:00:15,530 --> 00:00:16,040 ‫to say. 6 00:00:16,520 --> 00:00:23,660 ‫So we use them to identify or to give a new identity, unique identity, sometimes to any specific block. 7 00:00:24,290 --> 00:00:26,330 ‫Now how do we know this is valuable? 8 00:00:26,330 --> 00:00:27,720 ‫Or maybe I have an image. 9 00:00:27,740 --> 00:00:29,000 ‫I have a logo image. 10 00:00:29,810 --> 00:00:36,770 ‫Let me call this as logo not being printed on power, but I'm assuming that you will understand that 11 00:00:36,770 --> 00:00:43,220 ‫here we have a logo not being, and the part name that I'm trying to give is travel meet. 12 00:00:44,240 --> 00:00:49,430 ‫So this is my first day and the second day I have some search bar. 13 00:00:49,700 --> 00:00:54,290 ‫So maybe I have a complete form here and then there are several other few. 14 00:00:54,380 --> 00:00:58,820 ‫Let me call this as input field and maybe a few other input fields. 15 00:00:58,910 --> 00:01:01,090 ‫So this is a big form. 16 00:01:01,100 --> 00:01:02,690 ‫I have certain things here. 17 00:01:04,610 --> 00:01:09,020 ‫Now, by the third part, I have some buttons, maybe log in button or something else. 18 00:01:09,380 --> 00:01:11,390 ‫So maybe I have these buttons. 19 00:01:12,510 --> 00:01:15,480 ‫Let me call it a log in something like this, so. 20 00:01:16,640 --> 00:01:20,150 ‫The second button will be referred to as registration. 21 00:01:20,840 --> 00:01:24,110 ‫So I have these three buttons, I have these content. 22 00:01:26,620 --> 00:01:26,830 ‫He. 23 00:01:31,520 --> 00:01:35,390 ‫So you see, as we are more content, this keeps on growing. 24 00:01:35,810 --> 00:01:38,180 ‫Now how do I call them? 25 00:01:38,180 --> 00:01:39,890 ‫How do I recognize them? 26 00:01:40,400 --> 00:01:44,090 ‫OK, if you say go to do that is related to image. 27 00:01:44,450 --> 00:01:45,890 ‫How do I know? 28 00:01:45,920 --> 00:01:46,640 ‫How do I know? 29 00:01:46,640 --> 00:01:51,350 ‫Which is that particularly in terms of system, in terms of computer? 30 00:01:51,680 --> 00:01:58,130 ‫I know this is they've been my long ways, but in terms of program, in terms of system, how they are 31 00:01:58,130 --> 00:02:03,190 ‫going to recognize this, that's where these glasses and IDs content. 32 00:02:04,040 --> 00:02:06,380 ‫So we basically add an attribute. 33 00:02:06,980 --> 00:02:13,970 ‫So we use I.D. equals to logo here, and this is a unique attribute. 34 00:02:14,420 --> 00:02:19,640 ‫And if I say it equals to logo, that means I'm calling to this particular note. 35 00:02:20,450 --> 00:02:28,460 ‫If I jump onto this page as a system, if I say go do, it equals two logo for us by declarative and 36 00:02:28,460 --> 00:02:29,090 ‫colors. 37 00:02:29,090 --> 00:02:36,500 ‫Background as black or blue opal something like this, they will jump here, they will jump to do and 38 00:02:36,500 --> 00:02:41,090 ‫they will get this logo and they will do all the changes here. 39 00:02:41,870 --> 00:02:43,640 ‫I hope you got the basic idea. 40 00:02:44,210 --> 00:02:47,910 ‫Now this is the first important functionality, which is it. 41 00:02:48,350 --> 00:02:49,550 ‫Now what is glass? 42 00:02:50,060 --> 00:02:56,450 ‫Glasses something similar that what we are doing with I.D. But we can use this glass name multiple times. 43 00:02:56,750 --> 00:03:00,060 ‫For example, when we say ID equals two logo. 44 00:03:00,350 --> 00:03:01,670 ‫It's a unique content. 45 00:03:02,020 --> 00:03:03,550 ‫It's a unique I.D. now. 46 00:03:05,260 --> 00:03:09,070 ‫And I cannot refer to our and quality logo again. 47 00:03:09,130 --> 00:03:10,930 ‫No, I'm not going to do that. 48 00:03:11,540 --> 00:03:18,190 ‫It is unique for individual elements and you cannot repeat it again and again. 49 00:03:18,220 --> 00:03:19,630 ‫Maybe you want to call this. 50 00:03:19,630 --> 00:03:24,460 ‫You can call this as such if you want, but you cannot call this as logo. 51 00:03:24,700 --> 00:03:26,770 ‫Remember, this idea is unique. 52 00:03:27,460 --> 00:03:31,600 ‫The second thing is class now Class B uses to generalize. 53 00:03:31,600 --> 00:03:32,560 ‫Think so? 54 00:03:32,560 --> 00:03:39,910 ‫I can use class here, and maybe I have some general content that I can refer here, or maybe anywhere 55 00:03:39,910 --> 00:03:40,210 ‫else. 56 00:03:40,600 --> 00:03:44,020 ‫So if I seek class, I will call this as now. 57 00:03:44,590 --> 00:03:47,200 ‫And similarly, I will add a class here. 58 00:03:48,480 --> 00:03:50,070 ‫And call this as now. 59 00:03:50,520 --> 00:03:54,450 ‫And similarly, add a class here and call this as now. 60 00:03:55,230 --> 00:04:01,950 ‫So now class means if I say now, that means all I am going to say like this, I'm going to select this 61 00:04:01,950 --> 00:04:03,720 ‫as well as I'm going to select this. 62 00:04:04,650 --> 00:04:05,940 ‫I hope you got the idea. 63 00:04:06,300 --> 00:04:07,770 ‫Let me divide this here. 64 00:04:08,970 --> 00:04:15,390 ‫So in this way, we are going to select all the elements, if I say IED items unique, it is restricted 65 00:04:15,390 --> 00:04:17,760 ‫to only one bag, one element. 66 00:04:18,690 --> 00:04:22,560 ‫But if I say glass, it can be repeated multiple times. 67 00:04:22,800 --> 00:04:27,720 ‫Now why this is important in this way, we can balance both type of grouping. 68 00:04:28,080 --> 00:04:31,440 ‫Now here I know all this content is navigation. 69 00:04:31,450 --> 00:04:38,340 ‫So if I said now a background of navigation is blocked, that means the whole navigation bar will be 70 00:04:38,340 --> 00:04:38,730 ‫blocked. 71 00:04:39,150 --> 00:04:46,410 ‫But if I see a background of a particular IED is transparent, then I can add some other restriction 72 00:04:46,410 --> 00:04:49,020 ‫and I can customize that particular element. 73 00:04:49,560 --> 00:04:56,130 ‫So it will help us to generalize, also maintain the uniqueness that the shark form of glasses and if 74 00:04:56,790 --> 00:05:02,910 ‫you have generalized content with the help of glasses, but you have maintained their identity also. 75 00:05:03,240 --> 00:05:06,540 ‫Now, if I need to give it here, I will call this as such. 76 00:05:07,800 --> 00:05:14,280 ‫So in this way, I have generalized this as navigation, and I have also provided a uniqueness of such. 77 00:05:16,190 --> 00:05:21,200 ‫And similarly, I will call this as odd authorization that include log in and registration. 78 00:05:21,800 --> 00:05:25,610 ‫So that's how this whole I.D. and glasses work. 79 00:05:25,940 --> 00:05:30,590 ‫Now this is pretty important for CFS as well as JavaScript. 80 00:05:31,100 --> 00:05:34,820 ‫So maybe in future you jump onto the train javascript content. 81 00:05:35,240 --> 00:05:36,770 ‫This is going to help you a lot. 82 00:05:37,280 --> 00:05:44,090 ‫Now, one important thing that you need to understand when we work with CSIS, we need to add styling, 83 00:05:44,270 --> 00:05:50,120 ‫but how we will learn if I say I need to stay in this log in button or I need to stay on this registration 84 00:05:50,120 --> 00:05:50,510 ‫button. 85 00:05:50,690 --> 00:05:52,280 ‫How we are going to add styling. 86 00:05:53,490 --> 00:06:00,420 ‫The easiest way is I'm going to tell my program getting to Dave and Sage for ideas on it and then select 87 00:06:00,420 --> 00:06:00,960 ‫the button. 88 00:06:01,830 --> 00:06:07,470 ‫Now if I need to add unique idea for this element or log in, I'm on this as noggin. 89 00:06:07,860 --> 00:06:14,370 ‫So if I need to say OK, I need both specifically designed this button, I can get to this button and 90 00:06:14,370 --> 00:06:15,360 ‫select this ideas. 91 00:06:15,360 --> 00:06:17,010 ‫Log in that time window. 92 00:06:17,010 --> 00:06:18,420 ‫Design this log in button. 93 00:06:18,930 --> 00:06:21,990 ‫So that's how we grow things with the help of the vision. 94 00:06:22,260 --> 00:06:25,710 ‫And that's how we divide things with the help of these ideas. 95 00:06:25,980 --> 00:06:28,470 ‫That means to provide unique name to everyone. 96 00:06:28,980 --> 00:06:30,660 ‫So here we maintained everything. 97 00:06:31,350 --> 00:06:32,610 ‫I hope you got the idea. 98 00:06:32,640 --> 00:06:36,240 ‫If not, I strongly recommend to watch this lecture again. 99 00:06:36,450 --> 00:06:39,300 ‫And the previous one also this divine span thing. 100 00:06:39,840 --> 00:06:45,540 ‫This will help you to understand how to group things, as well as provide them a unique way so you can 101 00:06:45,540 --> 00:06:46,410 ‫customize them. 102 00:06:47,190 --> 00:06:48,630 ‫That's all on. 103 00:06:48,630 --> 00:06:53,850 ‫One quick, important thing that you can do right now is provide names to all these elements. 104 00:06:54,210 --> 00:07:00,660 ‫So since you can see we have described this as banner, but instead of doing this individually, we 105 00:07:00,660 --> 00:07:02,400 ‫can provide them specific name. 106 00:07:02,880 --> 00:07:10,920 ‫One example I can add a class here and call this as further, and maybe I can add a glass here and call 107 00:07:10,920 --> 00:07:16,980 ‫this as main content and I can also call this has class here and Android. 108 00:07:16,980 --> 00:07:18,480 ‫This has navigation. 109 00:07:19,890 --> 00:07:23,910 ‫So that's how I can divide things into multiple form. 110 00:07:24,300 --> 00:07:31,260 ‫So this is one time now ahead, I hope you got the concept this device referred to as squandered this 111 00:07:31,260 --> 00:07:36,570 ‫day is referred towards, I mean content and this is referred to as our navigation. 112 00:07:36,840 --> 00:07:42,030 ‫And then we have grouped things according to our own requirements and some basic example that help you 113 00:07:42,030 --> 00:07:43,830 ‫to understand this basic concept. 114 00:07:44,220 --> 00:07:45,420 ‫Now there are a lot more things. 115 00:07:45,420 --> 00:07:50,790 ‫Don't worry, even if you don't understand this, we have a lot more concept, but make sure to try 116 00:07:50,790 --> 00:07:52,920 ‫to understand this right now itself. 117 00:07:52,920 --> 00:07:57,210 ‫Watch the lecture again so you can understand CFS quite pretty well. 118 00:07:57,550 --> 00:08:01,770 ‫Also, if I click here, you can check how our mapping is done. 119 00:08:02,040 --> 00:08:06,400 ‫We are in the HDMI port and side that we have body inside that we have. 120 00:08:06,420 --> 00:08:13,220 ‫They've got navigation, which is our division with the navigation glass and inside that we have them 121 00:08:13,260 --> 00:08:20,940 ‫all watches this port and then inside that we have button with log in. 122 00:08:21,090 --> 00:08:22,800 ‫So this is mark and with log in. 123 00:08:23,190 --> 00:08:24,900 ‫So that's how we can map things. 124 00:08:25,800 --> 00:08:26,180 ‫OK. 125 00:08:26,220 --> 00:08:28,370 ‫That's all that said for this lecture. 126 00:08:28,380 --> 00:08:34,440 ‫In the next lecture, let us understand about one important topic, which is known as HDMI semantics. 127 00:08:35,070 --> 00:08:38,790 ‫The aim of this lecture was to understand I.D. as well as glasses. 128 00:08:39,120 --> 00:08:43,410 ‫It is used to provide unique name glasses is used to provide generally. 129 00:08:43,860 --> 00:08:46,950 ‫Now we are going to discuss about this more in next lecture. 130 00:08:47,370 --> 00:08:50,130 ‫So thank you for calling and I see you guys in the next one.