1 00:00:00,600 --> 00:00:01,290 Hello, friend. 2 00:00:01,440 --> 00:00:07,290 So in this lesson, we're going to talk about font and text decoration issues that are important in 3 00:00:07,290 --> 00:00:07,920 access. 4 00:00:09,200 --> 00:00:14,510 So now we're going to start preparing more organized and beautiful pages, if I may say so. 5 00:00:15,730 --> 00:00:22,450 So let's start Adam West when starting our topic and create a new e-mail file for the fund. 6 00:00:23,860 --> 00:00:27,820 And I said the name of our page as font and text HTML. 7 00:00:29,470 --> 00:00:36,160 So many female pages ready and on right, A.T.M. and press tab and the codes that we use in general 8 00:00:36,160 --> 00:00:36,920 are ready, of course. 9 00:00:37,720 --> 00:00:42,760 Now here I'll just write fonts in text decoration in the title section. 10 00:00:44,940 --> 00:00:48,320 Also right fonds text in a header with the H1 tag. 11 00:00:53,020 --> 00:00:59,110 Now, let's say I want to add a few paragraphs and make some changes to the articles in those paragraphs. 12 00:01:01,490 --> 00:01:09,460 So for this, go to Google and right lorem ipsum, because I don't want to just add random words to 13 00:01:09,470 --> 00:01:16,010 the paragraph section right now, by the way, lorem ipsum generally means imitation writing in the 14 00:01:16,010 --> 00:01:16,700 virtual world. 15 00:01:17,600 --> 00:01:22,070 Instead of using just meaningless words or, you know, God forbid you should encroach on somebody's 16 00:01:22,070 --> 00:01:27,530 copyright when you're trying out something, we can use these more meaningful paragraphs. 17 00:01:28,650 --> 00:01:33,480 And therefore, the documents that we prepare can, well, just look better visually. 18 00:01:34,330 --> 00:01:38,710 And you always see it coming up in template, so it's a lot of fun to know where it comes from. 19 00:01:40,070 --> 00:01:44,480 So here, I'll go to one of the pages that I come across and just copy the paragraph part. 20 00:01:45,470 --> 00:01:48,560 For now, we got two paragraphs, so let's. 21 00:01:51,850 --> 00:01:54,420 Let's run it into our page and see what we've done. 22 00:01:56,190 --> 00:01:59,190 And as you can see, are two paragraphs are ready. 23 00:02:00,410 --> 00:02:07,900 So now I'll just add the link tag, as hopefully you remember, to the header and to our success file 24 00:02:07,940 --> 00:02:08,690 externally. 25 00:02:10,540 --> 00:02:15,310 Now, if you want to, you can prepare a new access file, but I'm just going to continue using the 26 00:02:15,310 --> 00:02:19,000 first access project access file that we've had earlier. 27 00:02:21,850 --> 00:02:28,900 All right, so now I'm writing Google CSFs fonds before we start making changes to our success file. 28 00:02:30,340 --> 00:02:37,420 So I'm going just to the first place, W3 School, because, well, first of all, I just want to see 29 00:02:37,420 --> 00:02:42,550 how and why we can make with the font the changes that we can make. 30 00:02:43,580 --> 00:02:49,850 And as we can see when we open our page, the font properties rights that it defines the font, family, 31 00:02:49,850 --> 00:02:52,550 boldness, size and style of text. 32 00:02:54,910 --> 00:03:00,430 And when we first look at the font family feature, it says that there are two types of font family 33 00:03:00,430 --> 00:03:00,790 names. 34 00:03:01,710 --> 00:03:04,440 Generic family and font family. 35 00:03:05,480 --> 00:03:11,780 Now, just not to be confusing here, we just need to write the font family name when using it. 36 00:03:13,650 --> 00:03:18,360 So we'll use it like this font, family, font, family name. 37 00:03:20,260 --> 00:03:21,580 Now. 38 00:03:22,640 --> 00:03:25,250 Which font family will we use? 39 00:03:25,310 --> 00:03:25,940 Mm hmm. 40 00:03:26,720 --> 00:03:31,880 So in this, I'll Google again and write Success Fonts Stack. 41 00:03:36,290 --> 00:03:42,620 So here are the font family names supported on different machines, and when you look through a bunch 42 00:03:42,620 --> 00:03:46,540 of them, you'll come across Ariel and Haoma. 43 00:03:46,550 --> 00:03:52,370 Those are highly supported on Mac and Windows across most generations of operating systems. 44 00:03:53,970 --> 00:03:59,170 Helvetica is also supported on all Macs while Windows. 45 00:03:59,220 --> 00:04:02,010 Hmm, not so much anyway. 46 00:04:02,010 --> 00:04:05,280 So you can look at all the fonts you want to later. 47 00:04:07,090 --> 00:04:09,090 So it's not to be too confusing here. 48 00:04:09,180 --> 00:04:13,590 Let's do a few fun family trials with Adam. 49 00:04:14,860 --> 00:04:22,390 So what I'll do is indicate that I want to change the H1 tag in our file and I'll write the font family 50 00:04:22,570 --> 00:04:30,550 I just put Colon's here and I'll write the commonly used Aryal and I'll put a semicolon. 51 00:04:31,480 --> 00:04:36,010 I'd be better if we put Ariel in quotation marks while typing here. 52 00:04:37,670 --> 00:04:44,450 So over this name, it may not be the same way that we used it at first, but if there's a number in 53 00:04:44,450 --> 00:04:49,690 front of it, the use of unquoted quotes will throw up an error. 54 00:04:50,450 --> 00:04:56,660 So, yeah, when we say the changes and refresh our page, we'll see here that the header is in the 55 00:04:56,660 --> 00:04:58,310 font called area. 56 00:04:59,890 --> 00:05:04,480 And I said it here as font family to Haoma for the pétanque. 57 00:05:05,570 --> 00:05:08,690 And you can see the change by saving and refreshing the page. 58 00:05:11,100 --> 00:05:15,300 All right, so we're going to talk a little bit more about this, but first, let's look at a different 59 00:05:15,300 --> 00:05:18,420 font feature, the font style property. 60 00:05:20,000 --> 00:05:27,410 So this feature generally indicates whether this spelling is normal or italic italic in the font property 61 00:05:27,410 --> 00:05:32,830 style is in the P tag and we can see what changes occur. 62 00:05:33,530 --> 00:05:34,810 And there you go. 63 00:05:34,810 --> 00:05:38,030 Other paragraphs have indeed been italicized. 64 00:05:40,840 --> 00:05:45,610 And we'll look at the W3 school again and see the font size future. 65 00:05:46,720 --> 00:05:52,600 And when we look here, you talked about two different units of measurement, one of them is pixels 66 00:05:52,990 --> 00:05:54,820 and the other one is E.M.. 67 00:05:56,980 --> 00:06:06,700 So when we look at em, we'll see that one of them is equivalent to 16 pixels used by default, so the 68 00:06:06,700 --> 00:06:09,870 value we specified is 2.5. 69 00:06:09,870 --> 00:06:17,260 VCM is actually 2.5 times sixteen, which equals forty pixels makes in. 70 00:06:18,820 --> 00:06:27,460 So now I can specify the font size of the H1 tag on Atom as 40 pixels and the font size of the P tag 71 00:06:27,460 --> 00:06:29,560 as one point seventy M. 72 00:06:35,520 --> 00:06:40,140 And when we look at the changes, we can see that our articles are getting bigger. 73 00:06:43,860 --> 00:06:47,410 Elephant Whip is another important font feature. 74 00:06:49,370 --> 00:06:57,500 So this feature, it determines how to write the text in, whether it's normal or bold letters. 75 00:06:59,400 --> 00:07:06,210 Now, before we start using this feature, I do want to set a section with the spane element in the 76 00:07:06,210 --> 00:07:07,520 paragraph section. 77 00:07:07,860 --> 00:07:11,640 So for this, I'll just frame a few words with this spane element. 78 00:07:13,460 --> 00:07:14,420 In the first initial. 79 00:07:17,250 --> 00:07:22,230 Now, in the ceasefire, I said the font weight property to Bould for the spane element. 80 00:07:23,630 --> 00:07:29,240 And as you can see here, when we look at the changes that we made after we refresh our page, the words 81 00:07:29,240 --> 00:07:30,170 have become bold. 82 00:07:31,650 --> 00:07:36,090 All right, so let's talk about some of the text features as we approach the end of our lesson. 83 00:07:38,310 --> 00:07:44,370 So here's a text online feature where they say we can determine whether our article will be off to the 84 00:07:44,370 --> 00:07:46,230 right, to the left or in the center. 85 00:07:47,280 --> 00:07:54,870 For this, I can set the tax online property of the H1 tag to center and look at what that looks like. 86 00:07:55,900 --> 00:08:02,530 And yes, you can see our title has been censored, so if we want to, we can write this feature, right. 87 00:08:03,070 --> 00:08:06,640 And make the header over there to the right. 88 00:08:07,980 --> 00:08:13,920 But for now, I just want it to be in the middle right now, so I'm just going to do it again for the 89 00:08:13,920 --> 00:08:14,310 center. 90 00:08:17,530 --> 00:08:20,860 And another text feature is text decoration. 91 00:08:22,180 --> 00:08:28,060 So the text decoration property is used to set or remove decorations from our tax. 92 00:08:29,320 --> 00:08:38,020 So why don't we set it here, a text decoration overline for the H1 tag and underline for the paragraph 93 00:08:38,020 --> 00:08:39,280 and let's have a look at the difference. 94 00:08:40,630 --> 00:08:47,770 And now we can see what changes we've made with tax declaration when we refresh and review our page. 95 00:08:50,300 --> 00:08:56,420 Our last feature that I want to talk to you right now about in this lesson is the line height feature. 96 00:08:57,350 --> 00:09:00,470 And that determines the height between the lines. 97 00:09:01,740 --> 00:09:07,560 So why don't we just go ahead and use this feature to increase the saturation and the paragraph and 98 00:09:07,560 --> 00:09:09,030 said it's valued at two? 99 00:09:10,500 --> 00:09:15,930 Now, when we save and look at the changes, the hype between the lines is increased cool. 100 00:09:18,280 --> 00:09:23,650 All right, guys, so today we talked about font and text features and, hey, that's the end of this 101 00:09:23,650 --> 00:09:24,010 lesson. 102 00:09:24,010 --> 00:09:25,380 So we review it if you need to. 103 00:09:25,990 --> 00:09:27,670 And I want to see in the next lesson. 104 00:09:28,330 --> 00:09:29,590 So good bye for now.