HTML Introduction

What is HTML?

HTML is the abbreviation of HyperText Markup Language. We use this language for developing the Website in HTML with using tags.

First Webpage in HTML

♣ We can use notepad as a HTML Editor

Step 1. Open Notepad

Step 2. Type the following in the notepad

My First webpage

Welcome to My First Web Page


How to save the HTML page

⇒save this with .html extension


Your first webpage is ready to double click on it to view.


List of Tags in HTML

HTML  comment

we use <!– tag for comment in HTML

HTML link, HTML hyperlink and HTML href

How to create anchor hyperlink?

We use <a – tag for creating anchor hyperlink.

<a href = “”>Free Online Computer Courses</a>

<b> Bold the Text</b>

<body> type your body text here </body>

<br> we use this tag to type to the next line.

<center> center align the text</center>

<embed src=”file.ext” width=”50%”
height=”60″ align=”center”>

<font face=”Arial”>Rana Mehtab Alam</font>
<font size =”8″>Rana Mehtab Alam</font>
<font color =”red”>Rana Mehtab Alam</font>

<form action=”mailto:[email protected]
Name: <input name=”Name” value=””
Email: <input name=”Email” value=””
<center><input type=”submit”></center>

HTML headings

<h1>This is heading 1</h1>
<h2>This is heading 2</h2>
<h3>This is heading 3</h3>
<h4>This is heading 4</h4>
<h5>This is heading 5</h5>
<h6>This is heading 6</h6>

heading tag in HTML

<hr> </hr>

horizontal line

<i> Italic text</i>

HTML Images

<img src=”imagename.ext” width=”50″
height=”50″ border=”0″ alt=”describe your image” />

src “It specifies the path to the image”

Type image name with an extension like “imagename.jpg”, imagename is the image file name and jpg is the extension name.

You can also use the width and height tags to adjust image width and height.

You can also use the border tag to add a border around the image.

alt “It specifies the alternating text for the image”

List Items in HTML

<li type=”CCA”>Course 1</li>
<li type=”CCAG”>Course 2</li>
<li type=”CIT”>Course 3</li>

Example 2:

<ol type=”i”>


HTML scrolling text

<marquee><scroll Your Text</marquee>

<p>This is paragraph </p>

<p align=”left”>Left align the paragraph</p>

Left align the paragraph

<p align=”right”>Right align the paragraph</p>

Left align the paragraph

<p align=”center”>Center align the paragraph</p>

Left align the paragraph

<small>Lunar Computer College</small>

Lunar Computer College

<strike>Deleted Text</strike>
Deleted Text

<strong>This text is strong</strong>
This text is strong




HTML table

Online Computer Courses Lunar Computer College
S/No. Course Name Course Duration
1. CCA Three Months
2. CCAG Six Months
3. CIT One Year


<table border =”5″  width =”600″ align =”center”>

<caption>Online Computer Courses Lunar Computer College</caption>

<th>S/No.</th><th>Course Name</th><th>Course Duration</th>

<td>1.</td><td>CCA</td><td>Three Months</td>

<td>2.</td><td>CCAG</td><td>Six Months</td>

<td>3.</td><td>CIT</td><td>One Year</td>


HTML radio

Select a colour

HTML div , HTML radio

HTML codes for above radio button example

<p>Select a colour</p>

<input type=”radio” id=”red” name=”colour” value=”red”
<label for=”red”>Red</label>

<input type=”radio” id=”green” name=”colour” value=”green”>
<label for=”green”>Green</label>

<input type=”radio” id=”yellow” name=”colour” value=”yellow”>
<label for=”yellow”>Yellow</label>

HTML Videos

Now you can learn WordPress and develop your own website. You can also contact me to design and develop a website for you in cheep price.

Home   English   Courses    Computer     Free Children Stories

Spread the love
Rana Mehtab Alam Lunar Computer College.