HTML tutorial part:5 (Formatting & styling)

You definitely don’t want to show plain text without style and format in your website. In this lesson we will learn how to format and style a text. So lets get started.

Bellow here is a text line which we want to change the format.

Normal text: this is a text

Now I want to convert it into italic font. So that I need to put the text inside “<i>” tag just like bellow

Code example: <i>This is a text</i>
and the output will be: This is a text

I am giving some other example

For emphasized text

Code: <em>This is a text</em>
Output: This is a text

For marked text

Code: <mark>This is a text</mark>
Output:This is a text

For deleted formatting
Code: <del>This is a text</del>
Output:
~~This is a text~~

Now I am going to show you how to style a text

Change the color of a text

Code: “<h2 style="color:red">This is a text</h2>” or ““<font color="red">This is a text</font>”
Output:

This is a text

Making font size bigger

Code: <h2 style="font-size:50px;">This is a text</h2>
Output:

This is a text

Changing background

Code: <h2 style="background:yellow;">This is a text</h2>
Output:

This is a text

Note: instead of writing color name you can write color code for example

Code: <h2 style="background: #FFFF00;">This is a text</h2>
Output:

This is a text

You can see that I am writing here some code inside style=”” tag. Actually inside style=”” what I am writing is CSS code. It may kind of confusing for you but believe me it will be easy as we go through this course. For better understanding we have CSS course for you. You can check them later.

Posted At:

HTML

Tariqul Islam Adnan

I am tariqul and I’m from Dhaka, Bangladesh. I’m 21 and a part time blogger. Pro sunset is run by me, I also write and make video for it. I always like to share my experience with others and that is why tutorial making is my hobby. I mainly make tutorial on several topics like programming languages, web design and development, software development and other related topics.

Pro Sunset