html(hyper text markup language) bynaveen. introduction html or hyper text markup language is the...

HTML(Hyper Text Markup Language)HTML(Hyper Text

Markup Language)

By

Naveen

Introduction

• HTML or Hyper Text Markup Language is the standard markup language

• Its used to create the web page

• An HTML file can be created by using a simple

text editor via notepad, textpad, editplus.

• HTML file must have an extension htm or html.

Structure of HTML

<html>

<head><!..head section..>

<title>Title of the Web Page </title>

</head>

<body> 



<h1> Contents </h1>

</body></html>

Attributes of Body Tags

• Some important attributes of the BODY tag

– BGCOLOR = “color” / “#rrggbb” – BACKGROUND = “url of the image”– TEXT = “color” / “#rrggbb”– LEFTMARGIN = n– LINK = “color” / “#rrggbb”– ALINK = “color” / “#rrggbb”– VLINK = “color” / “#rrggbb”

Attributes of Format Tags

• Some important attributes of the Format tag• <FONT> tag

– Allows you to specify the font face and font size.• FACE specifies the font type. Defaults fonts like “Arial”, “Times New

Roman”, and “Courier” are available in all Systems.

• SIZE specifies the font size. Value can range from 1 to 7. The default is 3.

• COLOR- The color of a font can be specified using a hexadecimal number value six characters long

Attributes of Link Tags

• Some important attributes of the link tag

Used to link text with other documents

<A></A> HREF NAME (bookmarks inside the page) TITLE (balloon help in IE) TARGET (Define where the linked document will

be opened)

e.g.: <A href=“next.html”> Click here </A>

List Tags

1.Ordered Lists

- serial numbers appear– <OL> </OL> tag <LI> tag– TYPE attribute controls the numbering scheme– TYPE = 1 | A | a | I | I

2. UnOrdered Lists - Bullets appear– <UL> </UL> tag– <LI> tag– TYPE attributes specifies the type of bullet– TYPE = “disc” | “circle” | ”square”

Attributes of Table Tags

• Some important attributes of the table tag

Displays data in a table format

<TABLE> ….. </TABLE> • Some attributes

– ALIGN = LEFT | RIGHT | CENTER – BORDER = n (Number of Pixels ) – BGCOLOR = “color” | “#rrggbb”– CELLSPACING = n (Number of Pixels ) – CELLPADDING = n (Number of Pixels ) – WIDTH= % Of Parent | n (pixels)

Attributes of Image Tags

• Some important attributes of the image tag

<IMG> tag– SRC = “url” – BORDER = n – WIDTH=n (in pixels)– HEIGHT=n (in pixels)– ALT=“Alternate Text”

• Supporting Formats:– JPG, GIF and PNG image formats

Forms

• Used for creating Graphical User Interface (GUI)

• In a web application client interact through GUI

FORM by itself really cannot do anything

• Forms become powerful when connected to a server application

• A single HTML page can have multiple forms

Form Tags & Attributes

• <INPUT> tag is used to add elements to the form– NAME = “controlname”– TYPE = text / password / checkbox / radio/

submit / reset / button / hidden / file – VALUE– MAXLENGTH– SIZE

• Textbox is used to get the value from user.

• Password is used to get the password char “*”.

• Checkbox is used to choose the Boolean values .

• Button is used to execute the operation at runtime.

• Listbox is used to user can choose the list items..

Example

<form>First name: <input type="text" name="firstname"><br>

Last name: <input type="text" name="lastname"></form>

Example

<TABLE BORDER=“1” CELLSPACING=“1” CELLPADDING=“1” WIDTH=“30%”>

<CAPTION> Simple sample table </CAPTION>

<TR>

<TH>Heading1</TH> <TH>Heading2</TH> </TR><TR> <TD>Cell 1</TD> <TD>Cell 2</TD> </TR><TR> <TD>Cell 4</TD> <TD>Cell 5</TD> </TR>

</TABLE>

Heading1 Heading2

Cell 1 Cell 2

Cell 3 Cell 4

THANK YOU..!

html(hyper text markup language) bynaveen. introduction html or hyper text markup language is the...

Documents