|
HTML Basic Tutorial
Lesson 3
Heading tag
Different tags
Practice HTML (Use
it or Notepad)
Heading tag:
This tag is normally used to add heading in page. Html has normally 6
heading tags.
<h1></h1>
<h2></h2>
<h3></h3> |
<h4></h4>
<h5></h5>
<h6></h6> |
Ok Le't type our basic html tag first.
Now let's add heading tag & see how it works.
Type this text in your Notepad, save it and
look into your browser how it looks. or type it in our Practice Html.
<html>
<head>
<title>
My Web Page
</title>
</head>
<body>
<h1> Hi, Welcome to my web.</h1>
</body>
</html> |
Now your heading will look like this.
Here is how different heading tags create different size
of headings.
| <h1></h1> |
 |
| <h2></h2> |
 |
| <h3></h3> |
 |
| <h6></h6> |
 |
Note: Type different tags
and practice it several times that's how HTML should be learned. if you
are practicing it in our feature Practice HTML click on Reset to clear the
text every time.
Different Tags:
Bold: This
tag creates text as bold.
<b> </b>
Type this text in your Notepad or in our Practice Html.
<html>
<head>
<title>
My Web Page
</title>
</head>
<body>
<b> Hi, Welcome to my web.</b>
</body>
</html> |
Now your text will look like this. See
Normal text now looks bold.
Italic: It will make
your text Italic.
<i> </i>
Type the same basic html tags. Now instead of <b></b>
type <i></i>tags.
<html>
<head>
<title>
My Web Page
</title>
</head>
<body>
<i> Hi, Welcome to my web.</i>
</body>
</html> |
Now your text will look italic.
Bold and Italic together:
Now let's make it Bold as well as Italic.
<b> <i></i> </b>
it is called nested tags.
See now we've added two tags together. <b> <i></i>
</b> You can always use more than one tag together but there is a
rule that these tags should not overlap each other.
Ex. <first> <second>
</second> </first> This is the right
way to work with more than one tags.
<html>
<head>
<title>
My Web Page
</title>
</head>
<body>
<b><i> Hi, Welcome to my web.</i></b>
</body>
</html> |
Now your text will look like this. See
the difference, your previous text was only italic but now it is bold
also.
Paragraph: This tag
is used with paragraphs.
<p> </p>
<html>
<head>
<title>
My Web Page
</title>
</head>
<body>
<p>Hi, <p>Welcome
to my web.</p>
</body>
</html> |
You can see space between Hi, and Welcome. Paragraph
tag leaves a space between two lines.
Line Breaks:
<br>
This tag does not need closing tag.
<html>
<head>
<title>
My Web Page
</title>
</head>
<body>
<p>Hi, <br>
Welcome<br>
to my web.</p>
</body>
</html> |
<br> tag breaks the line and forces the
text to go into the next line.
Here is the difference between <p> tag and <br> tag.
<br> tag does not leave any space between two lines. But
<p> tag leaves one line space in between the text.
Two <br><br> tag gives the same effect of <p>
tag. Try it and find out.
Your text will look like this in browser.
Underline: Adds underline
in the text.
<u></u>
<html>
<head>
<title>
My Web Page
</title>
</head>
<body>
<u>Hi, Welcome to my web.</u>
</body>
</html> |
Your text will look like this.
Do not forget to use your closing tags.
Lesson
1
|| Lesson
2
|| Lesson
3
|| Lesson
4
|| Lesson
5
|| Lesson
6 ||
|
