CHAPTER 11 HTML
HTML stands for HYPERTEXT MARKUP LANGUAGE
HTML language is use to develop/design webpage.
HTML language is not case sensitive.
HTML language can be understood by the web-browser.
Website is a collection of web-pages.
A browser is used to open/access a website.
A browser is a programme through which we can access internet to open a website.
Example- Google Chrome, Internet Explorer, Mozilla Firefox.
HTML language use mark-up tags.
For HTML coding, we use a basic text editor like Notepad.
STEPS TO WRITE AND RUN HTML PROGRAMS:
Open Notepad Write Html Program Save File on the Desktop with the Extension .HTML
TO RUN: Double click on the file.
PROGRAMS
Creating webpage to display a message.
<HTML>
<HEAD>
<TITLE> My First Webpage</TITLE>
</HEAD>
<BODY>
HELLO WORLD
</BODY>
</HTML>
Break Tag
It is used to start a new line.
SYNTAX: <BR>
Example: -
<Body>
Oca <br>
Linkroad <br>
Cuttack
</Body>
ATTRIBUTES OF BODY TAG
Bgcolor: It is used to insert the background color of a
web-page.
Text: It is used to specify the text color of a web-page.
Example:
<HTML>
<HEAD>
<TITLE> My First Webpage
</TITLE>
</HEAD>
<Body Bgcolor= Red Text=White>
Oca <br>
Linkroad <br>
Cuttack
</BODY>
</HTML>
Background: It is used to insert image in the
background of a web-page.
<Body Background= “Path of Pictures”>
How to insert a picture:
Steps- Right click on the picture, which you want to
set as background properties copy (target)
Paste in the notepad.
Bold tag: It is used to make the text bold.
Syntax: <b>…… </b>
Italic tag: It is used to make the text italic.
Syntax: <i>…..</i>
Underline tag: It is used to underline the text.
Syntax: <u>……</u>
Superscript Tag: It is used to apply superscript effect on the text.
Syntax: <sup>…..</sup>
Subscript Tag: It is used to apply subscript effect on the text.
Syntax: <sub>…..</sub>
Example: -
<body>
<b> oca </b><br>
<i> linkroad </i><br>
<u>cuttack</u><br>
A<sup>2</sup><br>
H<sub>2</sub>o
</body>
Paragraph tag:
It is used to insert a paragraph. Default alignment of paragraph tag is left. The alignment can be
change to right and centre.
Syntax: <p>
<p> Odisha Computer Academy</p>
<p align= centre> Odisha computer academy </p>
<p align= right> Odisha computer academy </p>
Heading Tag:
There are 6 heading tags are available in html.
<h1> OCA </h1>
<h2> OCA </h2>
<h3> OCA </h3>
<h4> OCA </h4>
<h5> OCA </h5>
<h6> OCA </h6>
Font tag:
It is used to apply font face(type), font size and font color.
Syntax: <font> …..</font>
Example:
<p> <font face= arial size=”20” color= “red”> Odisha Computer Academy </font></p>
Example:
<font face= “Edwardian script itc” size=20 color=red>
Odisha Computer Academy
</font>
List tag:
By using List tag we can represent data items in a list format. It is divided into two types.
a) Ordered list
b) Unordered list
Ordered list:
In order list the default format is 1,2,3…The type can be changed to :
A ,B,C,…
a,b,c,…
i , ii , iii, …etc
Example:
<OL TYPE=i>
<LI> DCA
<LI> PGDCA
<LI> TALLY
</OL>
UNORDERED LIST:
In Unordered list, the data can be listed using bullets (Symbols). The type can be changed to square
and disc.
Example:
<UL type= “square”>
<LI> DCA
<LI> PGDCA
<LI> TALLY
</UL>
IMAGE TAG: It is used to insert an image on a web page.
SYNTAX:
<img scr= “PATH OF IMAGE”>
MARQUEE TAG: It is used to move any text/ object in the webpage.
SYNTAX:
<Marquee> … </Marquee>
Example:-
<BODY>
<MARQUEE DIRECTION=UP>
<IMG SRC= “PATH OF PICTURES” HEIGHT=200 WIDTH=200>
</MARQUEE>
</BODY>
TABLE TAG:
It is used to insert a table in a web page.
Table row <Tr>: TO START A ROW
Table head <Th>: TO INSERT HEADING
Table data <Td>: TO INSERT DATA
Example:
<BODY>
<TABLE border=5 cellspacing=4 bordercolor=blue height=200 width=300>
<TR>
<TH> ROLL NO</TH>
<TH> NAME </TH>
<TH> DOB </TH>
<TH> MOB </TH>
</TR>
<TR>
<TD> 1001</TD>
<TD> RAHUL</TD>
<TD> 10.04.2000 </TD>
<TD> 9090914703 </TD>
</TR>
<TR>
<TD> 1002</TD>
<TD> SIDHARTH</TD> Table
<TD> 26.11.2002 </TD>
<TD> 9090914703 </TD>
</TR>
</TABLE>
</BODY>
HYPERLINK:
It is used to link different web pages.
SYNTAX:
<A HREF>
Here, ‘A’ refers to Anchor.
HREF:
“HREF” stands for Hyperlink Reference.
Example: -
<BODY>
<A HREF=[Link]> TABLE</A>
</BODY>
FORM:
It is used to insert a form in a web page.
Example:
<Body>
<form>
USERNAME <input type= text> <br>
PASSWORD <input type= password> <br>
<input type= submit value= login>
<input type= reset>
</form>
</body>
“&nsbp;” : (Non-Breaking Space)
It is used to add space between label and text box.
--------------------------