Your students Welcome back.
I hope you're having an awesome day.
It's an awesome day.
We have our health.
We can see and we can learn new things every single day.
But anyways on this lecture young going to show you how to format a piece of tests using HD I.M. HMO
super easy to learn once you learn how the major components work.
They Well you have to do is you slant the tags.
You learn the middle tax.
So let's go ahead and do that right now.
So I'm going to right click on this sidebar right here.
Am going to create a new file new file and we're going to call this paragraph because that's where we
will be creating.
It's going to be super easy and we're going to name it with pantograph dot H.T. and Mail.
So when next boot extension there Dot a CML There we go.
So the only way that you will be able to see the mail file is if you have an extension that the mail
So make sure that you have a in the mail or that HVM without the mail either of those will work fine.
All right so once you have this file made Let's go ahead and create some têtes.
This is a sentence.
I'm just going to create some random tests here.
Got and save.
I'm going to use my keyboard shortcut command s and every time I say command.
As for Windows users is control.
As for of course as is for saving and all you can go to file and then save from there.
So let's go ahead and see these on the browser.
Let's go and click this little lightning symbol here.
That's going to be a preview actually.
And when this code does this to you like he's doing to me right now you see I'm sure I'm clicking it
and now working.
That's when you really close it without saving it.
You just close the code at it and that's what I did before I closed this and I reopened it.
And it didn't work for me so what you need to do is just quit it.
Come back to it.
And now you can preview in the browser right so when it crashes on you like it does.
That's because there's something wrong.
And just turn it off and turn it back on.
So anyways you see the sentence right here.
I'm going to show you a little trick that US developers use to see the file the markup the mail in the
back of this page right here.
Paragraph HMO because right now we have seen the representation of that code right in the background.
We're seeing that representation here in têtes.
Now we didn't put actually any code there but our browser detects that this is that direct mail file.
It is an e-mail file.
Any will by default put some code in there.
So I'm going to go ahead and click it any inspect element on it and as you can see by default without
Our coeditor now coeditor but are the browser already put on that extra mail tag here and heading to
a head tag in a body tag.
By default it does that.
Right now we have here what is called an on for Matt têtes this tetes has no style.
All right so it is showing it to us because it is just têtes but it not formatting the tetes.
So right now what we gonna do is we're going to format that tets And once we format text things are
going to be and we're going to format it using HD mail of course tags.
So let's show you how easy it is.
So we can use many different tacks to format test steps we actually email I'm going to use a p tag and
this is what is called and just type in and I'm going to do this type in a left angle bracket following
by the character P in a right angle bracket and the code will finish it off for you.
And what did the coeditor does.
Was finishing off the closing tag.
This is a closing tag.
All right so we got to wrap this têtes all formatted tetes into the tags every every tagging HDMI.
Almost almost every tag has a opening.
Bear attacks here right.
Actually one tag this is one tag and a closing tag.
And how do you know the difference.
Well the closing tag always has a forward slash right.
So we wrap any tests in tags.
In this case I'm using P-TECH because I want to format these steps as pantograph.
And these peace talks are going to do just it's going to give me some styles that I there are going
to represent a paragraph in the browser or I can use all the tact and I'm going to show you in a minute.
But let's go ahead and save this right.
And as you can see right here we have no styles in the right hand side this is the user agent.
So we have no styles for here.
When I refresh it.
Now if I go to the left side and I click on this little arrow to go inside the body tag and I go to
the B you can see that this user agent already is displaying some styles here.
So we got some styles going on this.
This is the styles right here on the right hand side.
So this tool from Google Chrome allows us to see the markup and styles in a lot of other information
that we can later on when we get more advanced.
We can look at.
But right now I know that this is the markup and this is their style.
So if I put my mouse over you can see the space on top and in the bottom by that color orange there
are right in that space is just a margin that's had this CSSA style.
So if we wanted to format these tests in another tag we could use another tag and we can just go ahead
and use an H1 tag which is heading that's the top level tag that's heading.
So if I refresh Now you can see that the text changes.
And if I put if I click here you can see that the styles are different for each one that has four styles.
Later on we are going to be able to override the default styles for H-1 to whatever we want we can change
the color of the sizing everything we want with the SS.
Just know that.
So as you can see here we're formatting the tetes using a different tag and that's all it is for the
So all you have to do basically is learn the differing HCM tags later on I'm going to show you the most
And once you learn the most popular tax you will be able to pick up the mail really quickly.
All right because that's all you need.
Once you learn the general tags then you can look up every other tag out there.
I will not be able to show you all the HMO tax in this course since there are so many of them and you
will learn them as you know when when you learn the east you you learn them every day and you will learn
those tags every day as you use the mail but believe me you will not use all the times of HMO ever.
All right there are too many of them but you will use the general ones and the next lectures will show
them to you.
So anyway thank you so much for watching this lecture.
It was a pleasure.
And I see you in the next one.