In this video.
Let's see how we are going to connect CSS to HTML using the inline method.
So back to Visual Studio code.
I have created a folder called link in CSS two HTML and you can name the folder the way you want it.
Then inside here I'm going to create one file called index dot HTML.
And I'm going to use Emmet to scaffold the HTML skeleton and I will say link CSS.
And inside the body.
I'm going to have each one and I will say, welcome to CSS.
Next step is let's open this by right clicking and click on Open with Live Server.
And mine has opened here.
In case you don't have the extension called live server being installed, let's go ahead and install
the live server as that.
Click on that to enable the extension.
And when you right click on your canvas, you're going to see open with live server.
Now let's implement the inline styling and it goes like this inside the tag, which is H1.
We are going to pass in additional attribute and that is the style.
And inside here we are going to provide the property and a value.
If you want to change the color, we are going to type in the color attribute here or property and then
colon, then the value.
Let's say I want to change this one to blue, save it.
And now let's have a look.
And indeed it is blue.
I can also add p tag here and use some REM text here as that.
And inside I will say style and I will say color is equal to blue violet.
Now let's see.
And indeed it is Violet and I can also change the size of the font.
So if you want to add more property to it, then it's going to be column here.
And I will say font size and I will say.
36.
Save it.
And indeed, the font is bigger than before.
This is how we use inline styling and as we spoke about, this approach is not recommended for larger
applications.
Assuming we have 100 lines of code, are we going to apply the CSS like this?
And remember each tag that we select, we can apply multiple CSS properties.
And with this one, we cannot implement responsive design.
So this approach is not the recommended way, but if you want to mimic or try something, then this
approach is the best way to go.
In the next video, we will talk about the internal or the embedded method.