Hello everyone and welcome back.
In today's video we learn how to state next elements like headings and paragraphs.
Jesus provides us with properties change font size color X alignment on much more let's try all these
properties with examples to understand them better.
So first let's write a new color on this text.
So let's bring up our good Ed. Let's start in other cities inspire so index don't see as this
lets linguists find view so length.
The relation is stained sheet.
The location is for its largest index dots CSX and then the diapers text C uses let's say it on let's
try giving this adding up other so say it sure.
So we've got the statement dog here.
So let's use the color So color is a blue let's say it.
And as you can see the color of the headings seems to blue.
Similarly if we want to change the color of the paragraphs so let's say color on Brown let's save it.
As you can see the color of the paragraph is also changed.
The next property is text alignment.
So as you can see right now the text is aligned on the left.
So we've got another property text aligned to align the stakes to left center and right.
So let's try that.
So text aligned say center.
Let's save it.
And as you can see the heading is in the center of the screen.
Similarly if we change it do text aligned right.
So the heading goes to the right hand side of the screen.
Similarly for the bar graphs let's say text align center all of text the center line.
Similarly if you do write all the text is right in line and you've got another option say justified.
So now all this takes will be scraped across the available space.
And as you can see all this text is stretched across the width of our screen.
So if you change just left it save it you see the second line as a space and being the first line had
this piece of being but if you're keeping it justified.
So it's straight below the end of the screen to the end of the line.
The next one is font style.
So we can define what it often does normal or italics
so let's say let's bring this back to center.
Let's see that.
Let's try this small boat on the heading same font style.
Italics let's say it as you can see beheading is not in italics font the next property that we have
is one tweet.
So this is defined the thickness of the font so let's say Alexa so let's try this property save for
a tweet so we can light up normal.
So currently the default value which is normal you can have it bold let's save it.
And as you can see in our funders ball or in through that we can give the values save four hundred so
four hundred which is a bit of.
So at this point we'd both from hundred 224 and make up to 800 900.
All right so let's say that.
And as you can see F1 is a big ten.
But if you make it 600 the font is a bit trickier.
So it's more do it's the ball inside the move but another property called text decoration.
So the purpose of this property is to underline the text or have a language with the text what you call
text so let's try not so text declarations on underline.
Let's say that and as you can see our heading is underlined similarly to accepts another value overlay.
And as you can see we've got a line over the next or about the text that it also accepts little value
line through.
So as you can see our text get straight through the line goes through our dates and accepts another
value going none.
So in that gives no line is shown or there's no line with the text that's all the text negation base.
So you can use this text like we should to remove the underlying phone links.
So when we explore in length we will talk about this again.
All right so we've got other property called text transform so the purpose of this property is to make
our text uppercase lowercase or capitalized.
So which is I think is so let's write up.
So text transform let's say public is.
And as you can see our entire text is now uppercase similarly lowercase.
And now as you can see you've done hitting all the alphabets are in lowercase.
And then you've got capitalized.
So this is like application.
So the first alphabet of a b word is capitalized.
I don't do apologies.
That's all for X transform then leave but another property letter spacing.
So the purpose of this property is to increase or decrease the space between alphabets.
So let's write about so you let us be saying don't make sense in Argentina.
The paragraphs.
So each alphabet has a little more space between each other.
So if you increase in say four pixels so we've got more space between the letters.
So if we reduce it to zero.
So it goes back to the original spacing but if you make it negative say minus one the text gets closer.
So let's say minus four.
And now the text is overlapping with each other.
So let's just increase it to say two pixels or let's just say one pixel just similar to this we have
another problem decoding good spacing.
So as name suggests what it does is it increases the space between two words.
So let's write like so let's start with zero pixels sense.
So this is the default value let's increase in say two pixels let's increase it a bit more say it pixels.
And now as you can see they've got more space between other words let's try using some negative values.
So minus 1 C minus 4 C minus a C minus twelve.
So as you can see now our roads are getting overlap with each other because of the negative little spacing.
So let's just bring it back to normal which is zero pixels.
That's all about the word spacing.
They've got another body like height.
So what this does is it increases the space between two lines so let's use Dr. C 1.
So this is the default dividing line.
How does one so let's just make it one point.
Do so it is now 1 1 2 times the default value.
Similarly let's make it one point five.
And as you can see the space with me online is going to increase.
Let's make it do so now it's the double off money for value that's also line.
Hi guys.
So we've got another property called for family.
So what it does is you can define the kind of phone that you want to use so to get some online funds
we can go to Google funds.
So let's open a new job and search for Google funds
let's select it.
Let's open this webpage.
As you can see it has got a list of lots of funds so let's say we want to use this open sounds.
So you have to just click on this plus button so then click here.
This fund is selected.
So just click on this bottom sheet now and it opens so as you can see just giving you a link here.
So this is a link to the Google funds API.
So to use it and CSF.
We just this one family under the name of the fund family and we can customize it.
So if you come here it shows you.
So you've got light which is 300 fund weight.
Then you've got like italics then you've got regular which is 400 fund weight on the most smallest atrium
decline to eat.
So let's say we won 700 gold.
So if you come back to this embed and now as you can see here we've got two different values.
So open sounds forced 400 and 700 let's copy this let's come back Hugh voodoo and make sort of stream
of fire and do I add links we added in the head element let's fix that here so coming back here that's
copy this.
So fine family open signs sans serif.
So coming back to that page let's other sites.
So let's say you want to add this fine family to that paragraph.
So let's just paste it here.
Let's save it.
And now as you can see we have a differing point similarly if you want to use some other find.
Just go back here.
Move it.
Say you want to report to just click on this.
It selects the font just copy this come back and pasted here so in sort of this open I'm saying you
don't want open sounds.
So we would just replace it here.
Or for example we want to vote so we could just add another link here let's save it.
Coming back to index to on a define family value so let's just be sit here coming back to the beach.
And now let's save this.
And as you can see are fun family changed again.
That's all for today guys.
If there's something that you did not understand feels you did drop a comment and we will discuss it.
See you in the next video by Sunday get.