Text Formatting and Colors

Learn HTML in the Simplest Way Text Formatting and Colors
21 minutes
Share the link to this page
Copied
  Completed
You need to have access to the item to view this lesson.
One-time Fee
$20
€18.61
£15.92
CA$27.32
A$30.37
S$27.04
HK$156.28
CHF 18.14
NOK kr218.51
DKK kr138.85
NZ$33.43
د.إ73.45
৳2,189.45
₹1,668.71
RM94.80
₦24,700
₨5,570
฿735.98
₺646.50
B$102.23
R370.34
Лв36.40
₩27,179.09
₪74.32
₱1,142.91
¥3,061.99
MX$338.74
QR72.81
P273.09
KSh2,694
E£958.90
ብር1,140
Kz16,750
CLP$18,953
CN¥144.74
RD$1,157.19
DA2,691.86
FJ$45.06
Q155.05
GY$4,175.76
ISK kr2,798.20
DH201.75
L354.29
ден1,146.14
MOP$160.63
N$372.20
C$734.80
रु2,662.54
S/75.10
K76.73
SAR75.01
ZK537.13
L92.63
Kč465.68
Ft7,250.51
SEK kr216.81
ARS$17,565.06
Bs137.83
COP$77,995.97
₡10,179.70
L495.20
₲149,493.31
$U766.70
zł80.54
Already have an account? Log In

Transcript

Hi, hello everyone. In this chapter we're going to start with text formatting. And we're going to learn how to do text formatting. We don't want the text to appear in default formatting. We want to add some styles some effects. So we're going to to learn how to change font case.

What is the font use, how to change its size, how to create bold, italic, and underlined text. Also, although to learn how to change text color, want to learn how to enter some special characters like Trademark, Trademark or copyright or something like this. How to make a superscript or subscript and how we can use this in order to write mathematical and chemical formulas in your HTML page. Then we're going to learn about lists. We have three different types of lists, numbered lists, bulleted lists and definition lists are going to learn about old these types of lists. So, let us start with our first example.

How to do that. Now let us see what is our is our example. Now, we have some tickets This is raking in a ball. So, this is my phone, this is no more pumped, as you see there is a difference in how the pump appears. This is another phone yes totally different. And also this is normal optics.

So, we have two different types of bots. Now, if we take a look at its source is bigger. Okay, this is our last My HTML page structure, HTML head on face. Then now in order to write font with specific font face, then you simply type font face equals then you type the font and you need to type it like this. While you should take the name of the font that is available in the operating system, normally because HTML runs on any operating system, so you don't have the much wide range of fonts to be used, you need to use some specific fonts so that you make sure it appears in every browser in every operating system. So this is a function written whizzes by Arial Helvetica sans so then we create a new line.

As you see, this is my phone. This is written Arial Helvetica sans serif generally just write some don't work because Sousa is a difference between the two font styles. Now we have another font face named Korea new Korea model like this, this is how you write it. So this is another form. And as you can see, really it's totally different style. This This is how it looks like and this is another form for the Korea how looks like and again we're just normal text with no font is defined.

So that we feel what is the difference between the default font and the font that you customers. So, this is simply the result of our first example and we learn here how use truncation of the to create some form Now in second example, we're going to learn how to deploy from source Okay. Let us see the source. We have learned before about the heading styles and we have seen that we have six different heading styles. But there is another way in order to deploy on size. You use a font tag.

So you write font size equals one, you have sizes from one till seven. This is the maximum or largest form where one is the least and seven is the highest. Well, this is in contrary to heading styles because in heading styles, h1 is the largest. h6 is the smallest. So here font sizes Because you are as you see, this is a pic is written in size one and this is non market so that will compare what is the difference between the longer text and the sizes whenever we customers. Also this is our largest font size seven.

And as you can see this is the font with size seven and this is a normal case. Now you feel how large when never use a size with a phone. So, this is size one, this is size seven, and this is a normal text. So, in this example, we have learned how to modify your font size. In this example, we need to learn about help us more of the line text So, this is how the example will appear like, let us see. Okay, whenever we need bold text so you simply add the tag Be bold.

So this is born Pakistan you close you and create a new life. And again why Norma tech is so that we can compare house both text appears like and how normal text appears like. So as you can see, this is a bold text, yes it appears with bolt. And this is normal like this in order to create a palette because then we use take all. So as you can see here, this is the case and we'll close things in again create a new one. Then we write no matter this was a to compete.

So this is how we collect text looks like this. Now no more textbooks. Again we can use you paid for on the line. So, this is you and this is on the line and this is normal. Someone may ask Okay, how about if I want to create bold, italicize and underline text at the same time, simply use combination of pigs. So, I can simply write something like this.

Bold and you won't eaten and the old on the right you this is all early line then close with the same order enough to our So like clothes you then buy clothes or clothes, the border is important in closing up now, it doesn't matter for me Wasn't he comes Paris or oil comes first or you comes first, what matters is that in the same order that you are opening your take must be the same order you close the text in or two out. So this is enough so close enough first, then this is the next enough. So I close it here and this is the final inner soil closing. So if I save this Is it See this is how it looks like. So this is normal. This is bold yes it appears as though it is as valid also and it is on download.

Now someone may ask Okay, how if I want to make it with bigger size, simply just as you take, so I need bone size equals seven for example. Okay this is bold, whatever. Then finally close my phone I can see you refresh. Okay, so I have made this as bold, italicize and underline text. So in this example, we'll learn how to create more depending on who it is. And now we can combine different effects in order to create variations of the effects.

Okay, next, we're going to learn about colors how we can deploy colors. Don't let this be so hokey, whenever you need to write with red color, for example. Then you simply use a phone tag with a car. attribute. So font colors equals red, this is the text. If you want to use blue for example, you simply type blue or green, you have of course, the list of colors, you know, quite Whatever you need, you can simply upload.

So here we use also some comps. And again, you can combine your effects so you have an assignment now, we want to create a case that is bold, italic, underline, with bigger size and with different color. You can use any color that you want or any competition. This is an exercise that you have to do. But in this example, we learned how to create contrast In next example, we're going to learn how to create some fixing the font, like we can create a superscript or subscript, we can create also some special characters and we can use these things in order to write in current medical equations like what you see here. So let us see.

Okay, in this example, we're going to learn many things. Now, this is chemical equations, this is written with bold, okay, we have learned previously how to create bold text. So this is B, and this is chemical equation, and this is the closing of the bold face. So this is normal. We have learned this before. But now what is new that I need to create some intent.

We have learned before also blockquote. But if I want to be able to determine number of spaces, then we use something called non breaking space. Of course, if you're not multiple spaces like this, it doesn't have any effect. As we have known before the HTML is different. It's a markup language unique among everything that you need with tags and HTML components. So in order to create a release is in the HTML file, use something called non breaking space.

Simply This is an ampersand then nbsp non breaking space then simple, this will create a single space. Now if you if you want more spaces, you simply repeat this is second space. Speech horseface peeps, so I have five spaces here okay. Now I write H H is of course, no more than this, but in chemical equations, then some text is subscript is subscript. So it appears like lower and with slightly smaller cells. So use sub take, so this is for subscript.

So this is how it looks like when I close the sub tag, then of course, it returns to normal. So, I can simply write h two h two, which is of course, a mathematical formula for both. Now, if I need to write mathematical equation, like if I want to write y equals x squared so easy case will use sub sub with P capital. It's B not B. So in this case, this is how it looks like y equals x squared. Also have learned before about the deep tech in order to align the thickest in center.

Now I need to write copyright take. Of course in copyright this I can there is no simple little keyboard right? So you have a special code in HTML code and copy semi colon. So this will create the copyright Mark like this. Also, there is a resistant mark this or surround surrounded by a circle. So it's 10th grade Singapore.

If you need to add a trademark then you simply write its code and 8482 semicolon and this will create this trademark effect. Okay, so, we have learned in this example many things, we have learned about some codes that add some special codes and non breaking space in order to create a space, we have learned the song. Taking order to create sub script takes a subscript x, and we have learned the sub trick that you can use in order to create superscript s. And we have learned some special codes for copyright. We just have more in trademark. Though our final example in this chapter, we're going to learn how to Three different types of lists. Now, let me make this look some a little bit bigger.

See, if I have a list named programming, see I can use this circle bulleted lists or square bulleted lists or a circle with solid color like this. And also I can use it with number milliliters you Okay this is the normal definition till you reach peak. Now, we are going to learn about something called ul ul is a command for an ordered list. In this case we don't have a specific order there is no this is one this is tools is s3 there is no order to just type your list. So, you can use u L and you have type equals circle like this. So, whenever you say type equals circle, it appears with this with this consistent then I can use heading three in normal drawing point by 10 like this, this is with what it appears like when you use the take a lawyer a lawyer is in line for at least iPad.

So you have a list item, Java for example, then you close the list item then I create another one list item for C sharp also same thing I can repeat with a different type equals square. So, as you see there is a square effect like this. And again I can write my title with heading three like this and use a lawyer to write you your list then I have my third type is this of course it appears as a simple solid color like this. Okay, now if I need to create something, let numbers to in this case, I can give books as my title, then you don't have to type 1234 because in this case, if you need to change it will be difficult. Or you can simply just write your list using any URL or you take in the same portals that you want them to appear.

And the browser is automatically going to create it for you. Okay, so this is simply, we're usually using o l o L is an acronym for ordered list. So, we have an order here that appears as 1234. Okay, this is what was our final examples a shocker, we have learned in many things in order to be able to permit your Tetris. So we will, we are now able to change our font face size, bold italicize, underline, text color, how bold some special characters, the superscript subscript how we can use mathematical and chemical equations and you know in use different types Please. So this is endo support for sec you guys see you next chapter.

Thank you

Sign Up

Share

Share with friends, get 20% off
Invite your friends to LearnDesk learning marketplace. For each purchase they make, you get 20% off (upto $10) on your next purchase.