1 00:00:00,360 --> 00:00:02,430 Hello everyone and welcome back. 2 00:00:02,430 --> 00:00:06,130 In today's video we will learn how to stylings. 3 00:00:06,270 --> 00:00:11,870 We can use a general services as properties like font size color background color except like the outside 4 00:00:11,870 --> 00:00:12,720 instrument needs. 5 00:00:13,620 --> 00:00:16,050 Let's try some examples to understand it better. 6 00:00:16,920 --> 00:00:21,530 So this is the code that got let's bring about good and here. 7 00:00:22,430 --> 00:00:25,280 Let's give all back on color to our top bar. 8 00:00:25,550 --> 00:00:26,990 So let's do that. 9 00:00:29,570 --> 00:00:32,180 See background color. 10 00:00:32,340 --> 00:00:33,750 Light blue let's save it. 11 00:00:34,650 --> 00:00:41,690 Let's give it somebody say 24 pixels 48 pixels save it. 12 00:00:42,690 --> 00:00:44,720 Let's remove this margin from the body dog. 13 00:00:45,060 --> 00:00:47,590 So for that we can do something like this. 14 00:00:49,180 --> 00:00:51,570 June 0 and save a 15 00:00:54,390 --> 00:00:56,220 now coming back to this Lynx 16 00:00:59,110 --> 00:01:03,210 so we need to start on multiple attachment elements so we can use. 17 00:01:03,910 --> 00:01:14,860 Let's say menu item let's just copy this base did you hear that same old so because this is the glass 18 00:01:14,860 --> 00:01:16,830 we need to use Dart. 19 00:01:17,050 --> 00:01:24,550 So menu item let's increase the font size say 36 pixels. 20 00:01:24,890 --> 00:01:32,360 Let's save it or let's say 24 pixels let's give it a margin right. 21 00:01:32,470 --> 00:01:45,230 Say 24 pixels let's say that let's change the color say black and as you can see now our link has a 22 00:01:45,230 --> 00:01:50,050 bigger font as a margin on the right and as a color black. 23 00:01:50,120 --> 00:01:51,990 Now let's say we want to remove this underline. 24 00:01:52,010 --> 00:01:57,620 So for that we can use a double body politics degradation so let's use that. 25 00:01:57,980 --> 00:02:00,500 So this decoration say none. 26 00:02:00,800 --> 00:02:02,760 Let's save it. 27 00:02:02,820 --> 00:02:05,840 And as you can see the underlings are gone. 28 00:02:06,800 --> 00:02:10,770 Now the extreme lengths have different states which are as follows. 29 00:02:11,690 --> 00:02:13,060 So the first one is length. 30 00:02:13,520 --> 00:02:15,740 So this is the state where link is not visited. 31 00:02:15,770 --> 00:02:22,970 So it looks like the default state then the next one is whether this is listed when the link is mystics 32 00:02:23,010 --> 00:02:28,270 or user clicked on the link and visited the page then you've got Hoover. 33 00:02:28,720 --> 00:02:35,260 So this is a state where mouses were right on the link and then you've got the last one which is active. 34 00:02:35,290 --> 00:02:38,900 So this investigation the link is linked that moment. 35 00:02:38,920 --> 00:02:46,100 That's the state quite active let's try giving states with these developments states first. 36 00:02:46,110 --> 00:02:54,960 We go to select our link so in our case menu item then we have to use Google and give the state name. 37 00:02:55,260 --> 00:03:02,650 So let's say by default we've got the link so let's give it a color see blue let's save it. 38 00:03:03,220 --> 00:03:06,090 And because these links are not listed by the user. 39 00:03:06,660 --> 00:03:11,320 So these links are linked similarly. 40 00:03:11,340 --> 00:03:18,760 Again let's select a link on let's give some states for dead so when someone visits these links don't 41 00:03:18,760 --> 00:03:19,620 them to green 42 00:03:23,210 --> 00:03:25,380 similarly let's try it for. 43 00:03:30,650 --> 00:03:39,400 So when someone who was doing them red and then got active so let's like some states for that as well. 44 00:03:40,720 --> 00:03:42,000 So a menu item. 45 00:03:42,020 --> 00:03:45,510 Colon active let's say hello. 46 00:03:45,690 --> 00:03:49,490 Google save it. 47 00:03:50,740 --> 00:03:58,480 All right so as you can see by default these links are blue because I have not read these links. 48 00:03:58,650 --> 00:04:03,730 Now when I hold the coalition to do great so I will hear on the Galapagos read. 49 00:04:04,080 --> 00:04:05,310 And same goes for this one. 50 00:04:08,160 --> 00:04:09,390 Then we've got active. 51 00:04:09,420 --> 00:04:12,470 So when I click on this link it should don't do well. 52 00:04:12,780 --> 00:04:14,390 So let's try that. 53 00:04:14,820 --> 00:04:18,030 As you can see the link went to Google when I clicked on it. 54 00:04:20,150 --> 00:04:23,260 On when I was at the link it should go green. 55 00:04:25,180 --> 00:04:28,840 So I've opened a link and a new tab on this link went green. 56 00:04:29,470 --> 00:04:30,470 Let's refresh the page. 57 00:04:30,520 --> 00:04:33,490 And as you can see because I've already listed this link. 58 00:04:33,520 --> 00:04:35,170 So now it's going to be green. 59 00:04:36,290 --> 00:04:38,360 All right so that's all for different states. 60 00:04:38,360 --> 00:04:43,240 So there are some rules when you define states but these link states. 61 00:04:43,370 --> 00:04:43,680 All right. 62 00:04:43,800 --> 00:04:44,950 So coming up here. 63 00:04:45,030 --> 00:04:48,260 So the first rule is more must come off the link and visited. 64 00:04:48,810 --> 00:04:53,770 So in our case also we've got hold of the link and visited. 65 00:04:54,000 --> 00:04:57,350 And the second rule is active must come after the. 66 00:04:57,450 --> 00:05:03,670 So active as you can see who's coming after Google that's all for today guys. 67 00:05:03,730 --> 00:05:08,940 If there's something that you do not understand feel free to drop a comment and we will discuss it. 68 00:05:09,100 --> 00:05:10,160 See you in the next video. 69 00:05:10,290 --> 00:05:10,640 Bye. 70 00:05:10,700 --> 00:05:11,390 By care.